vuecli-脚手架2和3的介绍及安装

什么是Vue CLI

如果你在开发大型项目，那么你需要，并且必然需要使用Vue CLI

• 使用Vue.js开发大型应用时，我们需要考虑代码目录结构、项目结构和部署、热加载、代码单元测试等事情。
• 如果每个项目都要手动完成这些工作，那无疑效率比较低，所以通常我们会使用一些脚手架工具来帮助完成这些事情。

CLI是什么意思？

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

Vue CLI使用前提-Node

安装NodeJS

直接在官网下载安装。
网站：Node网址

检测安装的版本

默认情况下自动安装Node和NPM
Node环境要求8.9以上或者更高版本

什么是NPM呢？

• NPM全称是Node Package Manager
• 是一个NodeJS包管理和分发工具，已经成为了非官方的发布Node模块(包)的标准
• 我们会经常使用NPM来安装一些开发工程中依赖包

Vue CLI的使用

安装Vue脚手架

npm install -g @vue/cli@3.2.1

如果安装成功：执行vue --version出现版本号

拉取2.x模板（旧模板）：

npm install @vue/cli-init@3.2.0 -g

初始化项目

• Vue CLI2初始化项目

vue init webpack my-project

CLI2目录结构详解

认识Vue CLI3

vue-cli3与2版本的区别

• vue-cli3是基于webpack4打造，vue-cli2还是webpack3

• vue-cli3的设计原则是“0配置”，移除了配置文件根目录下的，build和config等目录

• vue-cli3提供了vue ui命令，提供了可视化配置，更加人性化

• 移除了static文件夹，新增了public文件夹，并且index.html移除到pubic中

• Vue CLI3初始化项目

vue create my-project

Vue CLI3配置去哪里了

• UI方面的配置
  1.启动配置服务器：vue ui
  2.