Vue vue.config.js 的详解与配置
Vue的 vue.config.js 配置
1. 为什么要配置 vue.config.js
由于 vue-cli 3 也学习了 rollup 的零配置思路，所以项目初始化后，没有了以前熟悉的 build 目录，也就没有了 webpack.base.config.js、webpack.dev.config.js 、webpack.prod.config.js 等配置文件。
但是有些内容需要进行相关的配置，所以我们还是要创建一个vue.config.js来进行数据修改，比如代理啥的
2.里面的配置详解
vue.config.js 文件是一个可选的配置文件，存放在根目录中，要是有这个文件，在@vue/cli-service 启动的时候会自动加载，所以我们在修改里面的内容之后，要进行项目重新加载。 同时你也可以在package.json中的vue字段（这里有时间在研究）
配置选项：
首先页面里面出现这个 没有就自己写
每次在用的时候都是直接从网上找一个复制下来，用到哪个地方修改哪里，但是一直不知道具体是怎么操作，怎么使用，毕竟这关系到项目的架构，还是直接明白所有的用法靠谱，最后会写一个复制用的，但是还是顺着看完。
首先是 publicPath
{
Type(类型): string
Default(默认): '/'
}
1.项目部署的基础路径
2.我们默认假设你的应用将会部署在域名的根部，
3.比如 https://www.my-app.com/
4.如果你的应用时部署在一个子路径下，那么你需要在这里
指定子路径。比如，如果你的应用部署在
https://www.foobar.com/my-app/
那么将这个值改为 `/my-app/`
拓展：把开发服务器假设在根路径，可以直接使用一个判断
publicPath :process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/'
outputDir (基本不动，打包目录不都是用那个吗)
{
Type(类型): string
Default(默认): 'dist'
}
1.将构建好的文件输出到哪里（或者说将编译的文件），当运行 vue-cli-service build 时生成的生产环境构建文件的目录。注意目标目录在构建之前会被清除 (构建时传入 --no-clean 可关闭该行为)。
assetsDir (基本上都是默认)
{
Type(类型): string
Default(默认): ''
}
1.放置生成的静态资源 (js、css、img、fonts) 的目录。
注(我没懂)：从生成的资源覆写 filename 或 chunkFilename 时，assetsDir 会被忽略。
indexPath (没动过)
{
Type(类型): string
Default(默认): 'index.html'
}
1.指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径。
filenameHashing (默认就行)
{
Type(类型): boolean
Default(默认): true
}
1(摘录).默认情况下，生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存。然而，这也要求 index 的 HTML 是被 Vue CLI 自动生成的。如果你无法使用 Vue CLI 生成的 index HTML，你可以通过将这个选项设为 false 来关闭文件名哈希。
注意：这个是比较重要的有延伸，vue感觉上侧重于单页面应用，意思就是只有一个页面，里面的操作都是通过组件的切换来完成的但是你也可以使用多页面
单页面应用（spa）
概念：只有一个html页面，所有跳转方式都是通过组件切换完成的。
优点：页面之间跳转流畅、组件化开发、组件可复用、开发便捷、易维护。
缺点：首屏加载较慢，加载整个项目中使用的css、js，SEO优化不好。
多页面应用（mpa）
概念：整个项目有多个html，所有跳转方式都是页面之间相互跳转的。
优点：首屏加载较快，只加载本页所使用的的css、js，SEO优化较好。
缺点：页面跳转较慢。
vue 如何实现多页面应用 https://www.jianshu.com/p/eceb2ac9df90
vue中如何配置多页面配置 https://www.jianshu.com/p/52c4913e0bf4
pages (我相信将来我会用到的)
{
Type(类型): Object
Default(默认): undefined
}
1.在 multi-page（多页）模式下构建应用。每个“page”应该有一个对应的 JavaScript 入口文件。
举例子：
// 用于多页配置，默认是 undefined
pages: {
index: {
// 入口文件
entry: 'src/main.js', /*这个是根入口文件*/
// 模板文件
template: 'public/index.html',
// 输出文件
filename: 'index.html',
// 页面title
// 当使用 title 选项时，
// template 中的 title 标签需要是 <%= htmlWebpackPlugin.options.title %>
title: 'Index Page'
},
// 简写格式
// 模板文件默认是 `public/subpage.html`
// 如果不存在，就是 `public/index.html`.
// 输出文件默认是 `subpage.html`.
subpage: 'src/main.js' /*注意这个是*/
},
lintOnSave (默认)
{
Type(类型): boolean | 'error'
Default(默认): true
}
1. 是否在保存的时候使用 `eslint-loader` 进行检查。 有效的值：`ture` | `false` | `"error"` 当设
置为 `"error"` 时，检查出的错误会触发编译失败。
3. 是否在保存的时候使用 `eslint-loader` 进行检查。
4. 有效的值：`ture` | `false` | `"error"`
5. 当设置为 `"error"` 时，检查出的错误会触发编译失败
runtimeCompiler (默认 我没用过)
{
Type(类型): boolean
Default(默认): false
}
1. 是否使用带有浏览器内编译器的完整构建版本
2. 设置为 true 后你就可以在 Vue 组件中使用 template 选项了，
但是这会让你的应用额外增加 10kb 左右。
transpileDependencies (没用过)
{
Type(类型): Array
Default(默认): []
}
1. 默认情况下 babel-loader 会忽略所有 node_modules 中的文件。
如果你想要通过 Babel 显式转译一个依赖，可以在这个选项中列出来
3. babel-loader 默认会跳过 node_modules 依赖。
4. 通过这个选项可以显式转译一个依赖。
productionSourceMap (就只是知道这么个意思)
{
Type(类型): boolean
Default(默认): true
}
1. 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
crossorigin (不知道)
{
Type(类型): string
Default(默认): undefined
}
1.在生成的 HTML 中的 和