VITE + VUE 全局环境变量使用相关知识

最新推荐文章于 2024-09-29 15:21:30 发布

飒小北

最新推荐文章于 2024-09-29 15:21:30 发布

阅读量1.3k

点赞数 1

文章标签：前端 vite vue

本文链接：https://blog.csdn.net/tian_tian_gong/article/details/131964685

版权

一. 全局环境变量配置及使用

配置：创建.env和.env.development，.env.production等配置文件，.env.uat, .env.test及其它均可。变量要以大写的VITE_开头，如VITE_APP_NAME = 测试网站

使用：在代码中 import.meta.env.VITE_APP_NAME即可。

注意事项：默认先会去.env里找，然后根据当前环境去找。所以不区分环境的全局变量可以放在.env里，其它区分环境的全局变量可按环境来配置，变量名同名即可。

二. 运行或打包时环境变量的选择配置

"scripts": {
    "serve": "npm run dev", 
    "dev": "vite", // npm run dev， 默认读取development配置
    "dev:uat": "vite --mode uat",// npm run dev:uat 指定读取uat里的配置
    "dev:prod": "vite --mode production",// 指定读取production里的配置
    "build": "run-p type-check build-only", // 默认读取production里的配置
    "build:uat": "vite build --mode uat", // npm run build:uat 指定读取uat里的配置
    "build:dev": "vite build --mode development", //指定读取development里的配置
    "build:prod": "vite build --mode production", //指定读取production里的配置
     //  其它...
  },