vue.config.js常用配置详解常用配置详解
使用vue-cli3.0搭建项目比之前更简洁,没有了build和config文件夹。
vue-cli3的一些服务配置都迁移到CLI Service里面了,对于一些基础配置和一些扩展配置需要在根目录新建一个vue.config.js
文件进行配置
module.exports = {
// 选项...
}
基本路径
baseUrl从 Vue CLI 3.3 起已弃用使用publicPath来替代。
在开发环境下,如果想把开发服务器架设在根路径,可以使用一个条件式的值
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/'
}
构建输出目录(打包位置)
outputDir
当运行 vue-cli-service build 时生成的生产环境构建文件的目录
module.exports = {
outputDir: 'dist',
}
静态资源目录
assetsDir
放置生成的静态资源 (js、css、img、fonts) 的目录
module.exports = {
assetsDir: 'assets',
}
eslint代码检测
是否开启eslint保存检测,有效值:ture | false | ‘error’
设置为 true 时,eslint-loader 会将 lint 错误输出为编译警告。默认情况下,警告仅仅会被输出到命令行,且不会使得编译失败
希望让 lint 错误在开发时直接显示在浏览器中,可以使用 lintOnSave: ‘error’。这会强制 eslint-loader 将 lint 错误输出为编译错
误
webpack-dev-server 相关配置
devServer
devServer: {
open: true,//设置自动打开
port: 1880,//设置端口
proxy: {
//设置代理
'/axios': {
target: 'http://101.15.22.98',
changeOrigin: true,
secure: false, //如果是http接口,需要配置该参数
pathRewrite: {
'^/axios': ''
}
}
}
}
}
评论0