如何从 vite 的生产包中删除 process.env.NODE_ENV 并删除未使用的代码

Question

在从 webpack 迁移到 vite 的过程中，我们用来process.env.NODE_ENV添加特定的代码。

现在使用 vite，捆绑包包含了开发模式下的所有内容，包括process.env.NODE_ENV.

这里是vite.config.js：

import path from 'path'
import { defineConfig } from 'vite'

/**
 * @type {import('vite').UserConfig}
 */
export default defineConfig(({mode}) => {
  console.log('vite configuration for mode', mode);
  return {
    define: {
      NODE_ENV: "production",
    },
    build: {
      mode: "development",
      lib: {
        name: 'MyLib',
        fileName: 'mylib.production',
        entry: path.join(process.cwd(), "src/index.ts"),
      },
      rollupOptions: {
        external: 'react',
        output: [
          {
            format: 'umd',
            globals: { react: 'react' },
            entryFileNames: `mylib.production.js`,
          },
        ]
      }
    }
  }
})

和tsconfig.json：

{
  "compilerOptions": {
    "sourceMap": true,
    "strictNullChecks": true,
    "module": "esnext",
    "jsx": "react-jsx",
    "target": "es5",
    "allowJs": true,
    "moduleResolution": "Node",
    "noImplicitAny": false,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "declaration": true,
    "declarationDir": "dist",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "strict": false,
    "noEmit": false
  },
  "include": [
    "src"
  ]
}

如何process.env.NODE_ENV从捆绑包中消除未使用的代码？

谢谢。

Answer 1

您需要定义process.env.NODE_ENV如下：

https://vitejs.dev/guide/build.html

环境变量

.... 如果这是不可取的，您可以使用 define: { 'process.env.NODE_ENV': '"product"' } 例如静态替换它们。

（注意引号），或者例如：

export default defineConfig(({ mode }) => {
  return {
    define: {
      'process.env.NODE_ENV': JSON.stringify(mode),
    },
  }
})

。