Vue.js 是一个渐进式 JavaScript 框架，通过 Vue-CLI 可以快速搭建一个 Vue.js 项目环境。
本文需要配置以下软件：
- Node.js 和 npm
- Vue-CLI 3：
npm i -g @vue/cli
1. 创建项目
使用 Vue-CLI 3 快速搭建一个 Vue.js 项目
↑↓ 移动、Space选择/反选、Enter确认
终端中输入以下命令，回车执行
vue create { 短横线命名的 项目名 }
选择配置（可以使用此前保存的配置）
- 首次配置，选择 > Manually select features 自定义配置项
- 可以保存本次配置，下次快速创建同配置的项目
# Please pick a preset:
### 选择: Babel, TS, Router, Vuex, CSS Pre-processors
# Babel: ES6转ES5 编译器
# TypeScript: JavaScript 超集，支持面向对象
# PWA Support: 渐进式增强 Web 应用
# Router: Vue 路由
# Vuex: Vue 状态管理
# CSS Pre-processors: CSS 预处理器
# Linter / Formatter: 代码风格、格式校验
# Unit Testing: 单元测试
# E2E Testing: 端对端测试
使用 class 风格装饰器 => Yes
# Use class-style component syntax? (Y/n)
# 不使用装饰器: home = new Vue()
# 使用后: class home extends Vue{}
使用 Babel 结合 TS（实现自动检测Polyfills、转换 JSX） => Yes
# Use Babel alongside TypeScript
路由开启 History 模式 => Yes
# Use history mode for routers
选择一个 CSS 预处理器 => Sass/SCSS (with dart-sass)
# Pick a CSS pre-processor
### node-sass 实时自动编译
### dart-sass 需要保存后生效
将 Babel、PostCSS、ESLint 等的配置放在哪里？ => In package.json
# Where do you prefer placing config for Babel, PostCSS, ESLint, etc.?
# In dedicated config files ### 放在各自的配置文件中
# In package.json ### 放在 package.json 中
保存本次配置项 => Yes
# Save this as a preset for future projects?
# Save preset as: { 配置名称 }
等待项目构建完成……
2. 启动项目
Vue-CLI 3 启动命令由 dev 改为 serve
cd { 项目目录 }
npm run serve
3. 打包
使用 npm run build 打包项目。
打包后的文件，位于项目文件夹的 /dist 内。
