Vue CLI 3

[anjia]

https://cli.vuejs.org/zh/guide/installation.html

依赖 Node.js 8.9+, 推荐 8.11.0+ / 10.14.0+ brew upgrade node

npm uninstall vue-cli -g   # 若安装了旧版的 vue-cli，卸载下
npm install -g @vue/cli    # Vue CLI 3
vue --version     # 3.x

vue 3.1.3

Vue CLI 本身使用了一套基于插件的架构

用 Vue CLI 3.1.3 创建项目：

若保存了 preset，会在文件~/.vuerc里 这样，下次就不用命令行提示了，直接修改此文件即可

Vue CLI 里，@vue/cli-service安装了vue-cli-service命令

三个脚本：都有各自的 --options

• serve: 开发环境，构建。
  • 启动一个开发服务器（基于 webpack-dev-server）并附带开箱即用的模块热重载（Hot-Module-Replacement）
  • 命令行参数传参，也可以在vue.config.js里的devServer字段配置开发服务器
• build: 线上，构建。会在dist/目录产生一个可以用于生产环境的包
  • 带 HTML CSS JS 的压缩
  • 自动做的 vendor chunk splitting（更好的缓存）
• inspec: 可以审查 Vue CLI 项目的 webpack config
• lint:
• 其他命令：npx vue-cli-service help

更多配置 https://cli.vuejs.org/zh/config/

[anjia]

VUE CLI 包括几个独立的部分：

1. CLI @vue/cli：一个 npm 包，全局安装。提供了终端里的 vue 命令
2. CLI 服务 @vue/cli-service：一个 npm 包，局部安装在每个 @vue/cli 创建的项目中
   • 它是个开发环境依赖，包含了以下：详见 CLI 服务 章节
     • 加载其它 CLI 插件的核心服务
     • 一份默认的 webpack 配置
     • vue-cli-service 命令
   • 它构建在 webpack 和 webpack-dev-server 之上
3. CLI 插件

[anjia]

1. CLI 服务：命令、选项、环境变量+模式
2. 开发相关
   • 兼容性、HTML+静态资源、CSS
   • webpack、构建、部署
3. vue.config.js 配置