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",
})
相关推荐
kyriewen113 小时前
你点的“刷新”是假刷新?前端路由的瞒天过海术
开发语言·前端·javascript·ecmascript·html5
摇滚侠4 小时前
JAVA 项目教程《苍穹外卖-12》,微信小程序项目,前后端分离,从开发到部署
java·开发语言·vue.js·node.js
Timer@4 小时前
LangChain 教程 04|Agent 详解:让 AI 学会“自己干活“
javascript·人工智能·langchain
阿珊和她的猫5 小时前
TypeScript中的never类型: 深入理解never类型的使用场景和特点
javascript·typescript·状态模式
skywalk81635 小时前
Kotti Next的tinyfrontend前端模仿Kotti 首页布局还是不太好看,感觉比Kotti差一点
前端
RopenYuan7 小时前
FastAPI -API Router的应用
前端·网络·python
走粥7 小时前
clsx和twMerge解决CSS类名冲突问题
前端·css
Purgatory0018 小时前
layui select重新渲染
前端·layui
weixin199701080168 小时前
《中国供应商商品详情页前端性能优化实战》
前端·性能优化