Vite 应用程序在 DEV 中可以运行，但在 BUILD 和 PREVIEW 后不能运行 BigInt 不是一个函数

Question

大家好，我已经被这个问题困扰了一段时间，我通过 vite config 和 tsconfig 更改尝试了许多建议的解决方案。但在构建基于 Vite 的 React TS 项目时，我仍然遇到 BigInt 的问题

应用程序在运行 npm run dev 时完全正常工作，没有错误，并且构建完成且没有错误

vite 配置

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react-swc'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      process: "process/browser",
      stream: "stream-browserify",
      util: 'util'
    }
  },
  build: {
    minify: false,
    target: "es2020", // Enable Big integer literals
    commonjsOptions: {
      transformMixedEsModules: true, // Enable @walletconnect/web3-provider which has some code in CommonJS
    },

    rollupOptions: {
      // maxParallelFileOps: 2,
      cache: false,
    },
    outDir: "dist",
  },
  plugins: [
    react(),
    nodePolyfills({
      // To add only specific polyfills, add them here. If no option is passed, adds all polyfills
      include: ['path', 'https'],
      // To exclude specific polyfills, add them to this list. Note: if include is provided, this has no effect
      exclude: [
        'fs', // Excludes the polyfill for `fs` and `node:fs`.
      ],
      // Whether to polyfill specific globals.
      globals: {
        Buffer: true, // can also be 'build', 'dev', or false
        global: true,
        process: true,
      },
      // Whether to polyfill `node:` protocol imports.
      protocolImports: true,
    })],
    optimizeDeps: {
      esbuildOptions: {
        target: "es2020", // Enable Big integer literals
        define: {
          global: "globalThis",
        },
        supported: {
          bigint: true,
        },
      },
    },
})

tsconfig

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "ESNext", "DOM", "DOM.Iterable"],
    "module": "CommonJS",
    "skipLibCheck": true,
    "esModuleInterop": true,
    /* Bundler mode */
    // "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

错误

index-02ef721e.js:127068 Uncaught TypeError: r2.BigInt is not a function
    at index-02ef721e.js:127068:327
    at assets/index-02ef721e.js (index-02ef721e.js:128109:7)
    at __require (index-02ef721e.js:5:50)
    at index-02ef721e.js:244853:16

跑步后

npm run build
npm run preview

Answer 1

我遇到的问题与 Uniswap 包依赖有关。

为了解决这个问题，我安装了 JSBI 3.2.1，然后将其填充到解析部分下的 vite.config.js 中

jsbi: path.resolve(__dirname, 'node_modules/jsbi'),