vue配置文件，打包后配置域名

大得369

已于 2024-01-25 19:55:26 修改

阅读量512

点赞数 1

文章标签： vue.js 前端 javascript

于 2024-01-25 19:55:08 首次发布

原文链接：https://blog.csdn.net/ShIcily/article/details/106181880?ops_request_misc=&request_id=&biz_id=102&utm_term=vue%E6%89%93%E5%8C%85%E5%90%8E%E9%85%8D%E7%BD%AE%E5%9F%9F%E5%90%8D&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-7-1

版权

1、在项目中找到static文件夹，在里面创建一个配置文件，起名为config.js

┌── build 
├── config 
├── node_modules                    
├── src     
├── static  
│   ├── config.js  // 配置文件
│               
├── index.html:

2、然后在创建的config.js配置文件中，声明一个全局Windows对象Glob

/**
 * vue 打包生成配置文件，方便外部修改公共路径，不用每次都进行打包部署
 */
window.Glob = {
    BaseUrl:'http://39.99.202.195'
}

3、将此配置文件在index.html 文件中引入(注意：引用的路径)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>效果测试平台</title>
    <script type="text/javascript" src="./static/config.js"></script>
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

4、axios 配置文件

 
 
 
import axios from 'axios' 
....
let baseURL
// 判断开发环境（一般用于本地代理）
if (process.env.NODE_ENV === 'development') {      // 开发环境
    baseURL = '/api'
} else {                                           // 编译环境
    if (process.env.type === 'test') { // 测试环境
        baseURL = window.Glob.BaseUrl  // 在这里使用配置文件中的域名
    } else {   // 正式环境                               
        baseURL = window.Glob.BaseUrl  // 在这里使用配置文件中的域名 
    }
}

大得369

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
vue配置文件，打包后配置域名

1、在项目中找到static文件夹，在里面创建一个配置文件，起名为config.js。2、然后在创建的config.js配置文件中，声明一个全局Windows对象Glob。3、将此配置文件在index.html 文件中引入(注意：引用的路径)4、axios 配置文件。
复制链接

扫一扫