Vuecli2和Vuecli3初始化项目的过程，简单易懂

介绍

VueCLI 是一个基于 Vue.js 进行快速开发的完整系统，采用零配置等方式快速构建。

扩展：
CLI (Command-Line Interface)，翻译为命令行界面，是一个全局安装的 npm 包，提供了终端里的 vue 命令。俗称脚手架

构建项目

全局安装

npm install –g vue-cli

Vuecli2初始化项目过程

回车进入下一步操作

初始化命令

vue init webpack projectname

• 一
  
• 二
  
  runtime-compiler
  runtime-only
  两者区别：
  打包之后 选择第二个会比第一个少6kb，运行效率更高
  第二个会比第一个代码量更少，推荐第二种
• 三
  
• 四
  
  ESLint：是一种对js代码的一种限制，可以让代码书写更规范，安装之后代码不规范编译器报错
• 五
  这里是选择了ESLint的下一步
  
• 六
  
• 七
  

目录结构

Vuecli3初始化项目过程

初始化命令

vue create projectName

• 一
  
  在此就选择 Manually select features 手动选择特性

• 二
  

• 三
  
  在此选择vue2版本

• 四
  
  这里选择 In dedicated config files 放入独立配置文件

• 五
  
  如果保存了这次创建项目的步骤，到下次创建时会多出一个跟历史记录一样进行创建，具体在下面↓

• 成功创建
  

---

在这里是保存步骤后再次创建看到的样子

注意：如果保存了以上手动配置 这里会出现saveName 的选择，再次创建项目就会出现

想要删除这个保存按一下方法即可：

1. 首先找到这个.vuerc的配置文件
   

2. 打开 把里面的presets里面的内容删除即可
   

---

目录结构

到这里就结束了，后续还会更新vue全家桶相关，还请持续关注！
感谢阅读，若有错误可以在下方评论区留言哦！！！