创建vue工程, 配置选项说明

Vue 工程创建环境依赖：

1. 安装node: https://nodejs.org/zh-cn/download/ 直接到官网下载安装
2. 安装淘宝镜像（安装依赖速度比较快）：npm install -g cnpm --registry=http://registry.npm.taobao.org
3. 安装vue： npm install vue -g （使用频率高，直接全局安装）
4. 安装vue-cli： npm install -g @vue/cli （使用频率高，直接全局安装， vue -V查看cli版本）

cli3 命令行创建项目：

vue create

	vue create project-name //文件名 不支持驼峰

提示你选择一个preset（预设），选择第三个自定义配置

③ Manually select features：自定义配置我们所需要的面向生产的项目，提供可选功能的 npm 包

❯◉ Choose Vue version    # 选择vue版本,不选择,默认安装`2.6.11`版本的vue
 ◉ Babel				 # 语法编译器,es6->es5
 ◯ TypeScript			 # 支持使用 TypeScript 书写源码
 ◯ Progressive Web App (PWA) Support  # PWA，模拟原生app，渐进式网络应用程序 
 ◯ Router				# 支持 vue-router
 ◯ Vuex					# 支持 vuex
 ◯ CSS Pre-processors   # 支持 CSS 预处理器。
 ◉ Linter / Formatter	# 支持代码风格检查和格式化。
 ◯ Unit Testing			# 组件单元测试
 ◯ E2E Testing			# 端对端测试，模拟用户真实场景

按你项目需要选择功能

• 选择vue版本， 会让你选择2.x或者3.x,
  

  

• 是否选择class风格的组件语法?
  即原本是：home = new Vue()创建vue实例
  使用装饰器后：class home extends Vue{}
  

  

• 否使用TypeScript和Babel的形式编译 JSX

 Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? (Y/n) 

• router 提示：路由是否使用history模式?
  这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面

Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) 

• CSS 预处理选项：Sass/ Less
  

  

• eslint 提示： 选择语法检测规范
  

  

• 选择 保存时检查 / 提交时检查
  

  

• 选择测试方式：
  

  

• e2e测试方式

  

• 选择配置信息存放位置： 单独存放或者并入package.json
  

  

• 是否保存当前预设，下次构建无需再次配置
• 输入该预设名称
  

  

输入名字回车个，项目构建成功工后提示：

进入项目后输入npm run serve运行，运行成功：