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",
})
相关推荐
污斑兔2 分钟前
VMWare清理后,残留服务删除方案详解
前端
gong1917231696712 分钟前
非受控组件在React中的使用场景有哪些?
前端·javascript·react.js
TE-茶叶蛋13 分钟前
React 常见的陷阱之(如异步访问事件对象)
前端·javascript·react.js
zhangpeng45554794027 分钟前
C++编程起步项目
开发语言·前端·c++
whyfail1 小时前
[特殊字符] React Fiber架构与Vue设计哲学撕逼实录
vue.js·react.js·架构
秋田君1 小时前
构建安全的Vue前后端分离架构:利用长Token与短Token实现单点登录(SSO)策略
前端·javascript·vue.js·elementui·前端框架·mock·sso单点登录客户端
GISer_Jing1 小时前
Canvas &SVG &BpmnJS编辑器中Canvas与SVG职能详解
前端·javascript·编辑器
2402_881319301 小时前
web开发全过程总结
前端·javascript·vue.js
一峰说1 小时前
power BI 倒计时+插件HTML Content,实现更新倒计时看板!
前端·html
2301_816169611 小时前
vue路由小案例
前端·javascript·vue.js