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",
})
相关推荐
jingling5555 分钟前
无需重新安装APK | uni-app 热更新技术实战
前端·javascript·前端框架·uni-app·node.js
遇见小美好y6 分钟前
uniapp 实现向下追加数据功能
前端·javascript·uni-app
wuhen_n7 分钟前
数据缓存策略:让我们的应用“快如闪电”
前端·javascript·vue.js
wuhen_n8 分钟前
自定义指令:为 DOM 操作提供高效的抽象入口
前端·javascript·vue.js
C_心欲无痕11 分钟前
前端 PDF 渲染与下载实现
前端·pdf
jiayong2311 分钟前
可视化流程设计器技术对比:钉钉风格 vs BPMN
java·前端·钉钉
前端不太难13 分钟前
Flutter Web / Desktop 为什么“能跑但不好用”?
前端·flutter·状态模式
甘露s15 分钟前
新手入门:传统 Web 开发与前后端分离开发的区别
开发语言·前端·后端·web
双河子思16 分钟前
自动化控制逻辑建模方法
前端·数据库·自动化
wsad053220 分钟前
Vue.js 整合传统 HTML 项目:注册页面实战教程
前端·vue.js·html