前端打包需要向后台问一个接口访问地址,测试环境、生产环境都需要一个地址,每次打包时都要前端切换地址,感觉很麻烦,现在这个方法是打包后,在配置文件中修改地址。

1、在public 文件下新建一个config.js文件,并进行编辑

 

2、找到你请求接口的地方

const service = axios.create({
  baseURL: window.CONFIG.baseUrl,
  timeout: 10000
})

3、修改Index.html文件,引入config.js文件

<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <script type="text/javascript" src="./config.js"></script>
    <!-- built files will be auto injected -->
  </body>
</html>

 4、dist包

 

只要修改dist包下的config.js文件的url就可以了

Logo

前往低代码交流专区

更多推荐