vue打包后生成配置文件修改界面的方法

前言：

我们的vue代码打包上传到服务器后，如果数据接口后域名发生变化，是否需要再次修改vue文件中的接口？

能不能生成一个配置文件，里面可以配置域名或者其他字段，这样以后如果更改域名，只需要打开记事本修改域名就可以了。

教程：

步骤1:安装生成资产网络包插件

NPM安装-保存-开发-生成-资产-网络包-插件步骤2:配置网络包

//打包时让可配置文件var generatestplugin=require(' generate-asset-web pack-plugin ')输出；var createServerConfig=function(编译){ let cfgJson={ apirl : ' http://198 . 129 . 31 . 10833608080 ' }；返回JSON . stringify(CFGJSon)；}//打包时让可配置文件输入//此代码添加到plugins:[]，new generateeassetplugin({ filename 3360 ' servercconfig . JSON '，fn :(编译，CB)={CB (null，createserverconfig(编译))；}，extraFiles: []})步骤3:输入npm运行构建打包代码。结果如下

第四步：以后需要在serverconfig.json中修改域名等

第五步：获取个人信息

//定义一个全局函数vue . prototype . getconfig JSON=function(){ this。$ http.get ('serverconfig.json ')。然后((结果)={//用全局字段保存ApiUrl，或者使用sessionStorage存储vue . prototype . API URL=result . body . })。catch((错误)={console.log(错误)})；}第六步：使用ApiUrl

//在app.vue中执行this . getconfigjson()；mount ed : function(){ this . getconfigjson()；}//之后.它在需要使用的地方使用，因为ApiUrl是全局的。可以直接用这个来概括。apiurlvarurl=this。API URL'/API/.

以上是边肖介绍的打包vue后生成配置文件修改界面的方法。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！