【 Vue全家桶 · Vue CLI（二）】Vue CLI 4.0 的详细使用攻略（2020.10最新版）

前言 —— 本地环境搭建

使用Vue CLI 4.0搭建项目之前，你要确保你的本地已经安装好了node.js环境（推荐 v10 以上）以及npm。可查出版本号即可：

之后就可以使用npm全局安装我们的Vue CLI 4.0：

npm install -g @vue/cli
vue -V

一. 创建项目文件

Vue CLI 4.0中全新的项目创建命令为：

vue create project-name //文件名 

注意： 这里的文件名不能出现大写字母（驼峰命名法无效）。

二. 选择配置方案

之后会让我们选择创建项目的配置方案：

可以看到在最新版中有三个选项：

• Default（[Vue 2] babel，eslint）—— 基于Vue 2语法的默认配置；
• Default（[Vue 3 Preview] babel，eslint）—— 基于Vue 3语法的默认配置；
• Manually select features —— 自定义选择配置；

---

❀ 拓展一下❀

之前一直都是Vue 2.0版本，所以并没有其中的第二个选项。而在前段时间（2020.9.19 凌晨），官方终于发布了Vuejs 3.0的正式版本，代号：海贼王（One Piece）。

发布的英文原文地址：v3.0.0 One Piece

---

回到这一步的选择中，我们选择第三项：自定义配置（Manually select features）。通过键盘 ↑ ↓ 键选择选项，之后回车确定选择并下一步。

三. 自定义的可选配置项

这里会列出所有的可配置项供我们选择：
（操作为：按 空格space 是选中或取消选中，按 a 是全选，按 i 是反选）

有关每一个可配置项的简单介绍如下：
（如果你选择了其中某些项，你可以点击下表中对应的名称，快速查看该项详细的进一步配置信息）

可配置项	简介	备注
Choose Vue version	选择Vue版本	为新增项， 需要进一步选配Vue语法版本（2.x / 3.x Preview）
Babel	转码器	可以将ES6代码转为ES5代码
TypeScript	JavaScript的超集语言	包含并扩展了JavaScript语法，需要被编译输出为J