vite.config.js如何使用env的环境变量

了解下环境变量在vite中

  • 官方文档说到.env.[mode] # 只在指定模式下加载,比如.env.development只在开发环境加载

  • 至于为什么是development,而不是其他的,因为默认就是developmentproduction来区分开发和生产

    • 你也可以自定义,只需要在启动的时候添加--mode xxxx就可以,比如下面的
    • 下图为输出查看import.meta.env,就会发现mode变为了abdfed

"import.meta" is not available with the "cjs" output format and will be empty [empty-import-meta]

  • 如果你在vite.config.js中直接使用import.meta.env,就会发现出现这个错误了
js 复制代码
正在编译中...
▲ [WARNING] "import.meta" is not available with the "cjs" output format and will be empty [empty-import-meta]

    vite.config.js:15:28:
      15 │                     target: import.meta.env.VITE_APP_BASE_API,
         ╵                             ~~~~~~~~~~~
js 复制代码
import { defineConfig,loadEnv } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'

export default defineConfig(({ mode }) => {
    const root = process.cwd();
    const viteEnv = loadEnv(mode, root);
    console.log(viteEnv.VITE_API_ADDRESS);
    return {
        base: './',
        build: {
            minify: true,
            outDir: 'dist',
        },
        server: {
            port: '8067',
            proxy: {
                "^/sys": {
                    target: "https://abc.com",
                    changeOrigin: true,
                },
            },
        },
        plugins: [
            uni()
        ],
        exclude:[
            /\/README\.md$/,
        ]
    }
})
相关推荐
某公司摸鱼前端2 小时前
uniapp socket 封装 (可拿去直接用)
前端·javascript·websocket·uni-app
要加油哦~2 小时前
vue | 插件 | 移动文件的插件 —— move-file-cli 插件 的安装与使用
前端·javascript·vue.js
Fireworkitte3 小时前
Apache POI 详解 - Java 操作 Excel/Word/PPT
java·apache·excel
weixin-a153003083163 小时前
【playwright篇】教程(十七)[html元素知识]
java·前端·html
DCTANT3 小时前
【原创】国产化适配-全量迁移MySQL数据到OpenGauss数据库
java·数据库·spring boot·mysql·opengauss
Touper.4 小时前
SpringBoot -- 自动配置原理
java·spring boot·后端
wen's4 小时前
React Native 0.79.4 中 [RCTView setColor:] 崩溃问题完整解决方案
javascript·react native·react.js
黄雪超4 小时前
JVM——函数式语法糖:如何使用Function、Stream来编写函数式程序?
java·开发语言·jvm
ThetaarSofVenice4 小时前
对象的finalization机制Test
java·开发语言·jvm
思则变4 小时前
[Pytest] [Part 2]增加 log功能
开发语言·python·pytest