当前位置: 首页 > article >正文

vue3如何创建多环境变量

 首先在全局目录中新建.env.development文件和.env.production文件、.env.test文件

.env.development文件

VITE_MODE_NAME='development'

VITE_API_URL="http://xxxxxxxxxx"

注意:必须要以VITE_ 去开头,否则获取不到 

依次去配置.env.production文件、.env.test文件

然后在vite.config.ts文件中获取环境变量

import { defineConfig ,loadEnv  } from 'vite'

export default defineConfig(({ command,mode  }) => {

const env = loadEnv(mode, process.cwd());  //重点!!!!

  console.log("当前环境", env);

})

配置package.json

"scripts": {

    "dev": "vite serve",

    "build:dev": "vite build ",

    "preview": "vite preview",

    "build-only": "vite build",

    "type-check": "vue-tsc --noEmit",

    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",

    "build:test": "vite build --mode test",

    "test": "vite serve --mode test",

    "build:prod": "vite build --mode production",

    "prod": "vite serve --mode production"

  },

 

通过启动、打包命令去调整你需要哪个环境 


http://www.kler.cn/a/298903.html

相关文章:

  • 【JetPack】WorkManager笔记
  • Chrome 浏览器原生功能截长屏
  • javaEE-线程的常用方法-4
  • STM32F103 | Embedded IDE03 - 使用OpenOCD在STM32F103项目时出现下载固件失败
  • Android Studio AI助手---Gemini
  • BlueLM:以2.6万亿token铸就7B参数超大规模语言模型
  • Anti-honeypot - 自动识别Web蜜罐Chrome插件,附下载链接
  • 英文站外链如何建设?
  • 启动程序时遇到0xc000007b应用程序无法正常启动问题
  • Mongodb 4.2.25 安装教程
  • QDY421F-16P-25液氨不锈钢液动紧急切断阀
  • 若依项目后台启动报错: [网关异常处理]、503
  • c++指针和引用专题
  • Matlab程序练习
  • PCIe NVMe SSD 上电初始化全流程
  • Elasticsearch-数据迁移elasticdump
  • go--知识点
  • 大学生必看干货!分享5款ai写毕业论文软件
  • SQL 支持使用 GROUP BY多个列
  • 利用高德+ArcGIS优雅获取任何感兴趣的矢量边界
  • coredump-N: stack 消耗完之后,用户自定义信号处理有些问题 sigaltstack
  • 什么是站点内部搜索垃圾邮件攻击以及如何防范
  • 招商引资双招双引平台主要功能分析解决方案
  • 音乐播放器javaweb项目近日总结,用js,css,HTML,servlet,mybatis来写注册登录忘记密码(还没写好)
  • STL02——手写简单版本的list
  • 浅谈C#之485通讯