vue2 配置运行环境

vue2 配置运行环境

在 vue2 项目中配置运行环境

  • 在项目中新建 .env.development 文件 和 .env.production 文件
  • .env.development
javascript 复制代码
NODE_ENV = 'development'
//指定当前环境模式
VUE_APP_MODE = 'development'
VUE_APP_BASE_URL = "/dev-api"
  • .env.production
javascript 复制代码
NODE_ENV = "production"
//指定当前环境模式
VUE_APP_MODE = 'production'
VUE_APP_BASE_URL = "http://"  // 线上地址
  • 配置 vue.config.js 文件
javascript 复制代码
module.exports = {
  publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
  outputDir: "dist",
  assetsDir: "static",
  devServer: {
    proxy: {
      [process.env.VUE_APP_BASE_URL]: {
        target: 'http://',  // 本地后台地址
        changeOrigin: true,
        pathRewrite: {
        [`^${process.env.VUE_APP_BASE_URL}`]: ''
        }
      }
    },
  },
  transpileDependencies: true,
  lintOnSave: false,
}
  • request/index.js 中添加 baseURL
javascript 复制代码
import axios from "axios"

const request = axios.create({
  baseURL: process.env.VUE_APP_BASE_URL,
  timeout: 10000,
  headers: {
    "Content-Type": "application/x-www-form-urlencoded;charset=utf8",
  },
  responseType: "json",
})
相关推荐
90后的晨仔14 分钟前
ArkTS 与 Swift 闭包的对比分析
前端·harmonyos
小小小小宇24 分钟前
前端用户行为监控
前端
步行cgn36 分钟前
Vue 事件修饰符详解
前端·javascript·vue.js
vvilkim1 小时前
Flutter 状态管理基础:深入理解 setState 和 InheritedWidget
前端·javascript·flutter
Magnum Lehar1 小时前
wpf3d游戏引擎前端ControlTemplate实现
前端·游戏引擎·wpf
程序员小张丶1 小时前
基于React Native的HarmonyOS 5.0房产与装修应用开发
javascript·react native·react.js·房产·harmonyos5.0
早该学学了1 小时前
el-tabs问题解决大总结
前端
中微子1 小时前
回调函数详解:C++开发者视角下的JavaScript异步艺术
javascript
Sun_light2 小时前
LeetCode 59.「螺旋矩阵」
javascript·算法·面试
星河丶2 小时前
useEffect的清理函数的执行时机
前端·react.js