// vue.config.js文件是用于Vue CLI项目的全局配置的
module.exports = {
// 部署应用包时的公共路径
publicPath: "./",
// 生产环境构建文件的目录名（默认为dist）
outputDir: "dist",
// 放置生成的静态资源的目录（默认为dist/static）,可以修改为public。
assetsDir: "static",
// 开启eslint保存检测，有效值true/false/error
lintOnSave: true,
// 生产环境是否生成sourceMap文件，一般情况不建议打开
productionSourceMap: false,
// devServer相关配置
devServer: {
// 访问项目的IP地址，可以设置为“0.0.0.0”来使项目外部可访问
host: "0.0.0.0",
// 访问项目的端口号
port: 8080,
// 是否开启HTTPS模式
https: false,
// 自动启动浏览器
open: true,
// 配置反向代理处理跨域请求
proxy: {
// 请求地址
"/api": {
// 目标地址
target: "http://localhost:3000",
// 是否开启跨域
changeOrigin: true,
// 重写路径
pathRewrite: {
"^/api": "/api",
},
},
},
},
// webpack相关配置
configureWebpack: {
// 是否启动新的进程执行打包
parallel: true,
// 打包性能检测
performance: {
hints: "warning",
// 入口起点大小，此项必须设置
maxAssetSize: 300000,
// 生成的文件最大限制为1024KB
maxEntrypointSize: 5000000,
},
// // externals
// externals: {
// vue: "Vue",
// "vue-router": "VueRouter",
// axios: "axios",
// lodash: "_",
// echarts: "echarts",
// moment: "moment",
// },
},
// css相关配置
css: {
// 是否使用css分离插件
extract: true,
// 是否开启CSS source map
sourceMap: false,
// css预设器配置项
loaderOptions: {
sass: {
@import "@/style/global.scss";,
},
},
// 启用 CSS modules for all css / pre-processor files.
requireModuleExtension: false,
},
// 第三方插件配置
pluginOptions: {},
};
// 配置说明
// publicPath 部署应用包时的公共路径。例如，如果应用程序的 URL 是http://localhost:8080/my-app/，则设置publicPath选项为'/my-app/'，它将确保所有在HTML中使用的URL都正确的后续资源都具有正确的基本URI。
// outputDir 生产环境构建文件的目录名（默认dist）。
// assetsDir 放置生成的静态资源（js css img）的目录（默认dist/static）
// lintOnSave 启用 lint 检查器，有效值 true/false/error/warn，在生产构建时禁用它。
// productionSourceMap 如果您不需要生产时的source map，那么将其设置为false可以加速生产构建。
// configureWebpack 可以指定一个额外的对象来将这些配置传递给Webpack合并到最终配置中。
// devServer devServer跟服务器相关的配置项，如本地端口、代理等，具体可参考vue官网文档。
// css 单独的css文件的相关配置，包括源码、生成路径等，可自定义相关配置项。
// pluginOptions 用于插件在webpack下的一些配置项。例如vue-cli-plugin-style-resources-loader 和 vue-cli-plugin-mock，该插件是在测试环境下模拟数据请求的图标插件等。
