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",
})
相关推荐
M ? A几秒前
Vue 迁移 React 实战:VuReact 一键自动化转换方案
前端·vue.js·经验分享·react.js·开源·自动化·vureact
yuki_uix2 分钟前
重排、重绘与合成——浏览器渲染性能的底层逻辑
前端·javascript·面试
Burt12 分钟前
我的 2026 全栈选型:Vue3 + Elysia + Bun + AlovaJS
vue.js·全栈·bun
止观止28 分钟前
拥抱 ESNext:从 TC39 提案到生产环境中的现代 JS
开发语言·javascript·ecmascript·esnext
沃尔威武30 分钟前
调试黑科技:Chrome DevTools时间旅行调试实战
前端·科技·chrome devtools
小锋java123437 分钟前
SpringBoot 4 + Spring Security 7 + Vue3 前后端分离项目设计最佳实践
java·vue.js·spring boot
一 乐38 分钟前
校园线上招聘|基于springboot + vue校园线上招聘系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·校园线上招聘系统
yuki_uix39 分钟前
虚拟 DOM 与 Diff 算法——React 性能优化的底层逻辑
前端·react.js·面试
时寒的笔记39 分钟前
js逆向7_案例惠nong网
android·开发语言·javascript
yuki_uix40 分钟前
从输入 URL 到页面显示——浏览器工作原理全解析
前端·面试