vue/cli3脚手架笔记

VueCLi

CLI是什么意思

• CLI是Command-Line Interface翻译为命令行界面，俗称脚手架
• Vue CLI 一个官方发布Vue.js项目脚手架
• 使用vue-cli可以快速搭建Vue开发环境以及对应的Webpack配置

脚手架长什么样子

• CLI是Command-Line
• CLI (@vue/cli) 是一个全局安装的 npm 包，提供了终端里的 vue 命令。它可以通过 vue create 快速搭建一个新项目，或者直接通过 vue serve 构建新想法的原型。你也可以通过 vue ui 通过一套图形化界面管理你的所有项目。我们会在接下来的指南中逐章节深入介绍

Vue CLI 使用前提

• Node
• npm:包管理工具
• Webpack

VueCLI 使用

• 文档
• vue/cli
• 安装
  • npm install -g @vue/cli
• 初始化
  • vue ui 配置
  • vue/cli2
    • Vue CLI >= 3 和旧版使用了相同的 vue 命令，所以 Vue CLI 2 (vue-cli) 被覆盖了。如果你仍然需要使用旧版本的 vue init 功能，你可以全局安装一个桥接工具：
    • npm install -g @vue/cli-init
    • # `vue init` 的运行效果将会跟 `vue-cli@2.x` 相同
    • vue init webpack my-project
  • vue/cli3: vue create my-project
  • ESLint:ES(js)-lint :JS限制，编译器会报错
  • e2e：e to e 端到端
  • Nightwatch
  • npm clean --force
  • runtime-compiler & runtime-only
    • runtime-compiler
      • template->ast->render->vdom->UI
    • runtime-only
      • render->vdom->UI
      • 性能更好，代码更少