写作目的，并不是为了炫耀什么或者分享什么，纯粹是因为每次搭建的时候，都要去百度或者翻看之前的代码，故在此这里记录一下。
一. 按需加载
第一步，安装
babel-plugin-import依赖，使用如下命令：
npm i babel-plugin-import -D
第二步，在
babel.config.js中的内容如下：
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
"plugins": [
[
"import",
{ libraryName: "ant-design-vue", libraryDirectory: "es", style: "css" }
]
]
}
第三步，如果在
main.js中每引入某个组件，然后再use一下，会导致main.js看起来很乱。解决该问题，我们可以新建src/utils目录，然后再新建一个antdv.js文件(当然也可以叫其他名字)，然后在main.js中引入该 js 文件即可。
// src/utils/antdv.js 文件中的内容
import Vue from 'vue'
// 按需加载
import {Button, Layout, Menu, Row, Col} from 'ant-design-vue'
Vue.use(Button)
.use(Layout)
.use(Menu)
.use(Row)
.use(Col)
// main.js 中的内容
import '@/utils/antdv.js'
二. sass-loader和node-sass的兼容性问题
每次安装 sass-loader 和 node-sass 的时候，每次都要被恶心一下，现已测出一个比较好的版本搭配。
node-sass@6.0.1
sass-loader@10.2.0
三. 自动打开浏览器以及端口设置
在根目录下创建
vue.config.js在文件中加入如下内容：
module.exports = {
devServer: {
// 设置端口
port: 8686,
// 启动时自动打开浏览器
open: true
}
}
