Vue CLI 最新v4.5.11 (实时更新)

1.创建项目 vue create 项目名

这里有三个预设

Default ([Vue 2] babel, eslint)  
Default (Vue 3 Preview) ([Vue 3] babel, eslint)
Manually select features  # 手动选择功能

第一个预设是我之前保存的，那么如何删除预设

2.删除预设
打开资源管理器，找到一个名为.vuerc的文件，里面保存着预设信息

清除presets里面内容即可

3.选择 Manually select features创建咱们手动去创建


按照我们自己的需求去选择

这里我选择几个自己所需要的

这里问路由是否选择历史模式history

vue 里面路由有两种显示模式是hash和history，默认是hash

hash —— 即地址栏 URL 中的 # 符号（此 hash 不是密码学里的散列运算）。比如这个 URL：http://www.abc.com/#/hello，hash 的值为 #/hello。它的特点在于：hash 虽然出现在 URL 中，但不会被包括在 HTTP 请求中，对后端完全没有影响，因此改变 hash 不会重新加载页面。

history —— 利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。（需要特定浏览器支持）这两个方法应用于浏览器的历史记录栈，在当前已有的 back、forward、go 的基础之上，它们提供了对历史记录进行修改的功能。只是当它们执行修改时，虽然改变了当前的 URL，但浏览器不会立即向后端发送请求。

一般情况下两种都可以满足实际需求，不过在微信中的支付、分享等，url作为参数传递，页面会把"#"后边的内容处理掉，后台取不到#后面的东西除非将url进行编码，然后后端配合进行解码，显然是不满足实际需求的，因此要用到history模式。另外如果你追求url的美观，不希望url中含有#号，那你可以选择使用history。

使用history需要前后端同时进行配置

我这里选择history

选择一个CSS预处理器（默认情况下支持postss、Autoprefixer和CSS模块）

我选择node-sass

选择一个linter/formatter配置

ESLint with error prevention only 只配置使用 ESLint 官网的推荐规则

ESLint + Airbnb config 使用 ESLint 官网推荐的规则 + Airbnb 第三方的配置Airbnb的规则

ESLint + Standard config 使用 ESLint 官网推荐的规则 + Standard第三方的配置 Standard 的规则

ESLint + Prettier 使用 ESLint 官网推荐的规则 + Prettier 第三方的配置Prettier

主要是做风格统一 代码格式化工具

这里我选择第一个官方推荐的就可以了

拾取其他lint特征
选择第一个就可

在哪里放置Babel、ESLint等的配置？

Where do you prefer placing config for Babel, ESLint, etc.?
In dedicated config files #在专用配置文件中
In package.json 

我这里放在了package.json中

babel的作用就是将浏览器不认识的高级javascript语法解析成低级的语法，来实现浏览器的兼容

是否将此保存为将来项目的预设？

选择允许然后保存位置啥的随意填写即可

注：

如果下载不成功报错command failed: npm install --loglevel error 这个报错有可能是sass版本过高咱们下载项目时吧预选的css预处理器先不勾选等在项目里面下载个版本低一些的或者把.vuerc文件删除后重新下载，不行安装个淘宝镜像总有解决的方案 sass版本过高安装不上是个主要问题

然后下载完项目 进入 cd 目录 npm run serve 运行

如何关闭eslint检验
首先在根目录下新建vue.config.js文件

上面sass报错没有下载，现在在项目中下载个版本低一些的

npm install node-sass@4.14.1 

npm install sass-loader@7.3.1