浏览文章
文章信息
Vue自定义配置模块环境文件,无需重新运行即可改变运行环境
13654
./config/dev.env.js
'use strict' const merge = require('webpack-merge') const prodEnv = require('./prod.env') module.exports = merge(prodEnv, { DEV_ENV: { api_domain:'https://bbs.aiweline.com/rest/V0' store_code: 'default', token: 'dsdsadse3wf233t4rtffdfdd2', api: '/api', website_id: 2 } })./config/prod.env.js
'use strict' module.exports = { PROD_ENV: { api_domain:'https://bbs.aiweline.com/rest/V1' store_code: 'default', token: 'dsd2fdt4gfdgdfd2ghfdhdcs', api: '/dev_api', website_id: 2 } }./EnvConfig.js
const dev = true const devEnv = require('./src/config/dev.env') const env = dev ? devEnv.DEV_ENV : devEnv.PROD_ENV /* 导出配置 */ module.exports = { Env: env }./vue.config.js中引入EnvConfig.js
// 引入环境配置文件 const EnvConfig = require('./EnvConfig') // 在根目录下自行创建vue.config.js module.exports = { lintOnSave: false, // cli3 代理是从指定的target后面开始匹配的,不是任意位置;配置pathRewrite可以做替换 devServer: { port: '8080', open: true, proxy: { '/api': { target: EnvConfig.Env.api_domain, changeOrigin: true, pathRewrite: { '^/api': '' } }, '/dev_api': { target: EnvConfig.Env.api_domain, changeOrigin: true, pathRewrite: { '^/dev_api': '' } } } }如果在其余文件中使用到配置:(吐槽,VUE居然不支持自定义的配置直接导入vue.config.js希望可以支持)
例如我要在其他地方引用环境配置:
import { Env } from '../../EnvConfig'
完毕!小白VUE,不对请指教。