转自https://blog.csdn.net/zzsan/article/details/82667609 感谢原作者分享
关于vue-cli3.0的调整,请查看我此前的文章vue-cli3.0的调整
关于如何用vue ui命令创建新项目，请查看vue利用vue ui命令创建项目
vue cli 3 介绍
上次用vue的时候，vue cli的版本还是2，对应指令还是 vue init < 模板名称 > < 项目名称 >
vue-cli提供的模板有：
webpack 一个全面的webpack+vue-loader的模板，功能包括热加载，linting,检测和CSS扩展。
webpack-simple 一个简单webpack+vue-loader的模板，不包含其他功能，让你快速的搭建vue的开发环境。
browserify 一个全面的Browserify+vueify 的模板，功能包括热加载，linting,单元检测。
browserify-simple 一个简单Browserify+vueify的模板，不包含其他功能，让你快速的搭建vue的开发环境。
simple* 一个最简单的单页应用模板。
最近用的时候，已经有vue cli 3了,大致跑了一下，问题还是不大的，但是还是踩了些坑，具体在文章后续会分享。
前期准备
卸载旧版本
vue cli 升级到3后，package的名字从 vue-cli 改为了 @vue/cli，装了旧版本的，官方的建议是，把旧版本的卸载了，再安装新版本。
卸载指令如下：
npm uninstall vue-cli -g or yarn global remove vue-cli
node版本
官方建议，node.js的版本，需要是8.9或者以上（建议是8.11.0+）
安装
安装指令如下：
npm install -g @vue/cli or yarn global add @vue/cli
创建项目
vue create <projectName>
- 选择features
这里我选了第二个，手动选择需要的，个人选择了下图所示的内容。
- 是否使用history路由，这里感觉必要性不大，所以就没用上,有兴趣的或者需要使用的，可以参考Routing with history.pushState
- 选择css处理器，一般这里选第一个就可以了
- 代码风格和eslint
这里选的是eslint + standard config ， 个人比较习惯这种风格，具体怎么选择看个人习惯吧。 - 选择lint
- 选择lint的配置文件如何存放，这里我选了分别存到具体的config文件，而不是package，便于管理
- 是否保存本次创建项目的配置项，用于下次快速创建项目
- 然后就可以愉快地等待创建项目了
注意事项
vue cli配置文件
文件路径是：C:\Users\【用户名】\.vuerc
文件内容大致如下：
{
"packageManager": "npm",
"presets": {
"vue_create_project": {
"useConfigFiles": true,
"plugins": {
"@vue/cli-plugin-babel": {},
"@vue/cli-plugin-eslint": {
"config": "standard",
"lintOn": [
"save"
]
}
},
"router": true,
"routerHistoryMode": false,
"vuex": true,
"cssPreprocessor": "sass"
}
},
"useTaobaoRegistry": false
}
解析
packageManager 用于指定安装包和运行时，使用的是npm还是yarn
presets 上述安装步骤中，第7步询问是否保存创建配置，用于下次快速创建项目
关于配置，不小心踩的坑
安装过程中，曾经询问过我是用npm还是yarn指定安装包和运行，但是，由于没细看，选了yarn，后续安装过程中一直报错，具体错误如下图：
多次卸载重装vue cli，但是并没有解决问题，也没有重新提醒我选择npm或者yarn。
想了想，那可能是配置文件的问题了，但是又不知道vue cli 3的配置文件存在哪，想了想，会不会和设置npm源一样，可以用npm config这类指令呢
于是，打开了cmd，输入了vue -h
看到了有vue config指令，输入后显示如下：
除了把配置文件打印出来，还把配置文件路径打印出来了，so，不用看了，多次卸载重装,但是依旧未果的原因，就是因为卸载重装不会删除配置文件，这里直接把packageManager改成npm，就解决了上面遇到的问题了
参考链接
Vue CLI 3官网
Vue CLI 3指引文档(中)
Vue CLI 3指引文档（英）
对vue cli 2 感兴趣的，可以访问 git 上 vuejs/vue-cli 项目文档