用了generate-asset-webpack-plugin 这个插件,
在webpack.prod.conf.js中去生成configServer.json文件,让其在build的时候输出:
var GenerateAssetPlugin=require('generate-asset-webpack-plugin');
var createServerConfig=function(compilation){
//console.log("info from GenerateAssetPlugin:");
//console.log(compilation);
let cfgJson={ApiUrl:"192.168.11.90"};
return JSON.stringify(cfgJson);
}
//在plugins:[]中
new GenerateAssetPlugin({
filename: 'serverconfig.json',
fn: (compilation, cb) => {
cb(null, createServerConfig(compilation));
},
extraFiles: []
})
然后,在用axios,get一下这个json
getConfigJson(){
axios.get("serverconfig.json").then((result)=>{
console.log('read from json');
console.log(result);
}).catch((error)=>{console.log(error)});
}
入口main.js的时候,去调用一下这个getConfigJson(),算是把配置读到了。
费了半天劲,就是为了可以在server端可以有个可以用记事本随时修改的serverConfig.json
供自己和有同样需求的人参考。望有实际项目经验的分享下其它的方法。
ps:自问:这个会不好不安全?把服务api的url的暴露出来了,浏览器地址只要请求这个json,配置岂不是都看到了?
自答:如果害怕暴露,觉得webpack封装起来比较安全,那浏览器调试时,随便看下http请求也就知道url了,没有费更多的精力,所以应该和安全不安全没啥关系,就是怕有写权限json被篡改了吧?