基于 vue-cli 打包指定ip配置文件

配置文件所在的目录结构
基于 vue-cli 打包指定ip配置文件_第1张图片
module文件夹存放所有各后端ip的配置文件,类似与后端springBoot中yml一样
以下为base.js中代码

// 获取命令行中指定的配置文件
const configFileName = process.env.VUE_APP_CONFIG_FLIE_NAME;

let moduleType = configFileName !== 'undefined' ? configFileName : 'tianjin';
let moduleFile = require.context('./module', false, /\.js$/);
let module = {};
moduleFile.keys().forEach(key => {
  if (key.includes(moduleType)) {
    module = moduleFile(key).default;
  }
});
export default module;

vue.config.js中添加一下代码

const argv = JSON.parse(process.env.npm_config_argv);

const config = {};
let idx = 2;
const cooked = argv.cooked;
const length = argv.cooked.length;
while ((idx += 2) <= length) {
  config[cooked[idx - 2]] = cooked[idx - 1];
}

process.env.VUE_APP_CONFIG_FLIE_NAME = config['--configFileName'];

命令

# 运行命令
npm run dev  // 默认配置文件为天津
或
npm run dev --configFileName=tianjin  // 指定运行配置文件

# 运行命令
npm run build  // 默认配置文件为天津
或
npm run build --configFileName=tianjin  // 指定打包配置文件

如果提交代码时报JSON.parse错的话,是应为process.env.npm_config_argv不是一个真正的JSON数据,可以vue.config.js文件内容可以改为以下代码

const json = eval("("+`${process.env.npm_config_argv}`+")");
const argv = json ? json.cooked[3] : 'tianjin';
process.env.VUE_APP_CONFIG_FLIE_NAME = argv;

你可能感兴趣的:(vue.js,npm,vue-cli3)