前言
vue-cli3推崇零配置，其图形化项目管理也很高大上。
但是vue-cli3推崇零配置的话，导致了跟之前vue-cli2的配置方式都不一样了。
别名设置，sourcemap控制，输入文件位置和输出文件位置和输出的方式，压缩js控制，打包webapck日志分析，externals忽略配置（外部引入），调试的端口配置，proxy接口配置等等的。
有时候还需要我们配置的，因为官方推荐的，并不适用于我们平时的开发所用的。
所以，我的vue.config.js配置是下面这样的。还有一个改hash的配置，暂时还不知道如何配置，以后会解决的，解决的时候顺便更新这里。
资料查询借鉴地址：
https:
Vue CLI 3 是一个强大的工具，它为 Vue.js 开发提供了快速的脚手架环境，强调零配置。然而，尽管 Vue CLI 3 提倡零配置，但有些情况下我们需要自定义配置以满足特定项目需求。`vue.config.js` 文件就是用来进行这些自定义配置的地方。
在 `vue.config.js` 文件中，我们可以设置多个关键配置项来调整项目的行为。以下是一些重要的配置选项及其用途：
1. **publicPath**：这个选项用于设定生产环境和开发环境下的 URL 基路径。例如，当 `process.env.NODE_ENV` 等于 `'production'` 时，设置为 `'./'` 或 `'/'`，在开发环境则是相对路径。从 Vue CLI 3.3 版本开始，`baseUrl` 已被弃用，应使用 `publicPath`。
2. **outputDir**：指定构建完成后输出的文件夹名称。这通常是 `'dist'`，意味着所有编译后的资源都会被放在项目根目录下的 `dist` 文件夹里。
3. **assetsDir**：定义静态资源（如 JS、CSS、图片、字体等）在 `outputDir` 目录下的存放目录。设置为 `'assets'` 表示资源会被放在 `dist/assets` 下。
4. **productionSourceMap**：在生产环境下是否生成 source map 文件。如果设为 `false`，可以提高构建速度，但不利于调试。
5. **filenameHashing**：默认情况下，生成的静态资源文件名会包含哈希值，以利于缓存管理。设为 `false` 可以关闭文件名哈希，保持源文件名不变。
6. **lintOnSave**：在保存代码时是否运行 ESLint 进行代码检查。开启此选项有助于保持代码质量。
7. **devServer**：这部分配置用于 webpack-dev-server，包含以下子选项：
- **open**：设置为 `true` 会在启动服务时自动打开浏览器。
- **host**：设置监听的 IP 地址，`'0.0.0.0'` 表示监听所有网络接口。
- **port**：设置开发服务器的端口号，例如 `8066`。
- **https**：设置为 `true` 使用 HTTPS 协议。
- **hotOnly**：只使用热模块替换，不启用完整页面刷新。
- **proxy**：定义请求代理，例如将所有 `/api` 开头的请求代理到指定的服务器，以处理跨域问题。`target` 是目标服务器地址，`changeOrigin` 设置为 `true` 允许跨域请求。
除了以上提到的配置，还有其他可配置项，如 `pages`（多页面应用配置）、`configureWebpack`（自定义 webpack 配置）和 `pluginOptions`（插件选项）。Vue CLI 3 的强大之处在于它的灵活性，允许开发者根据项目需求进行定制，同时保持简洁的配置结构。
在实际开发中，开发者可能需要查阅官方文档或社区资源来获取更多配置细节，例如上面提到的 GitHub 仓库链接，它们提供了关于 `vue.config.js` 配置的更深入实践和例子。理解并熟练使用 `vue.config.js` 文件对于优化 Vue.js 项目的工作流程至关重要。
