uni-app创建的vue3项目打包后部署报错process is not defined，开发时没问题

操作步骤：

打包以后的问题

预期结果：

正常运行

实际结果：

报错，页面白屏

bug描述：

uniapp创建的vue3项目，打包报错后部署报错process is not defined，开发是没问题的

截图

项目信息	描述
产品分类	uniapp/H5
PC开发环境操作系统	Mac
PC开发环境操作系统版本号	12.0.1
HBuilderX类型	Alpha
HBuilderX版本号	3.4.12
浏览器平台	Chrome
浏览器版本	101.0.4951.64
项目创建方式	HBuilderX
App下载地址或H5网址	https://zqudou.cn/index.html

sinazl 1楼

发测试工程

htzhanglong 2楼作者

如果是使用 process 或者 process.env 造成该问题请直接使用环境变量，类似 process.env.变量名

h691938207 3楼

在 vite.config.ts 增加 define: {“process.env”:{}}
vite 在编译时会去掉所有 process变量不是办法的办法

caililin 4楼

怎么去掉

eggper 5楼

自定义“VITE_”开头的环境变量，node环境使用process.env.(name)获取，运行时使用import.meta.env.(name)获取。可以这样试试。

songsunli 6楼

uni-admin更新了，已经解决了这个问题。但是需要通过新建项目移植的方式解决。官方也没有提供uni-admin升级的方式，有点坑

yuanlaile 7楼

在 uni-app 创建的 Vue 3 项目中，打包后部署时出现 process is not defined 错误，通常是因为项目中使用了 process.env 相关的代码，而 process 是 Node.js 环境中的全局变量，在浏览器环境中并不存在。

解决方案

使用 Vite 的环境变量替换

如果你使用的是 Vite 作为构建工具，Vite 会自动将 import.meta.env 替换为环境变量。你可以将 process.env 替换为 import.meta.env。
```
// 替换前
const apiUrl = process.env.VUE_APP_API_URL;

// 替换后
const apiUrl = import.meta.env.VUE_APP_API_URL;
```

使用 DefinePlugin 替换 process.env

如果你使用的是 webpack，可以通过 DefinePlugin 来替换 process.env。在 vue.config.js 中配置：

const webpack = require('webpack');

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.DefinePlugin({
        'process.env': JSON.stringify(process.env)
      })
    ]
  }
};

使用 .env 文件

在项目根目录下创建 .env 文件，定义环境变量：
```
VUE_APP_API_URL=https://api.example.com
```
然后在代码中通过 process.env.VUE_APP_API_URL 访问。
检查第三方库

如果错误是由第三方库引起的，可以尝试以下方法：
- 更新库到最新版本，看看是否已经修复了这个问题。
- 如果库没有修复，可以考虑使用 webpack 的 externals 配置来排除这个库，或者使用 polyfill 来模拟 process。
使用 dotenv 插件

如果你需要在项目中动态加载环境变量，可以使用 dotenv 插件：
```
npm install dotenv --save
```
然后在项目入口文件中加载 .env 文件：
```
require('dotenv').config();
```