ultimately solve problems of node polyfills

trezor · Feb 26, 2025 · 73a6167 · 73a6167
1 parent 0fcadcd
commit 73a6167
Show file tree

Hide file tree

Showing 5 changed files with 278 additions and 28 deletions.
diff --git a/packages/suite-web/package.json b/packages/suite-web/package.json
@@ -59,6 +59,7 @@
         "stylelint-config-standard": "^36.0.0",
         "tsx": "^4.16.3",
         "vite": "^5.1.4",
+        "vite-plugin-node-polyfills": "^0.23.0",
         "vite-plugin-wasm": "^3.4.1",
         "webpack": "^5.97.1",
         "ws": "^8.18.0",

diff --git a/packages/suite-web/src/polyfills.ts b/packages/suite-web/src/polyfills.ts
diff --git a/packages/suite-web/src/vite-index.ts b/packages/suite-web/src/vite-index.ts
@@ -1,5 +1,3 @@
-import './polyfills';
-
 /*
  * On the start of the app, the index.html file is without div with id="app" to which React app should be rendered.
  * This div is added thanks to browser detection plugin in case that a user uses supported browser.

diff --git a/packages/suite-web/vite.config.ts b/packages/suite-web/vite.config.ts
@@ -1,10 +1,10 @@
-import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill';
 import { viteCommonjs } from '@originjs/vite-plugin-commonjs';
 import react from '@vitejs/plugin-react';
 import { execSync } from 'child_process';
 import { createReadStream, readdirSync, statSync } from 'fs';
 import { resolve } from 'path';
 import { Plugin, ViteDevServer, defineConfig } from 'vite';
+import { nodePolyfills } from 'vite-plugin-node-polyfills';
 import wasm from 'vite-plugin-wasm';
 
 import { suiteVersion } from '../suite/package.json';
@@ -127,8 +127,11 @@ export default defineConfig({
     root: '.',
     base: assetPrefix,
     plugins: [
-        NodeGlobalsPolyfillPlugin({
-            buffer: true,
+        nodePolyfills({
+            // Whether to polyfill `node:` protocol imports.
+            protocolImports: true,
+            // Include specific polyfills
+            include: ['buffer', 'process', 'util'],
         }),
         staticDataPlugin(),
         serveCorePlugin(),
@@ -185,10 +188,10 @@ export default defineConfig({
         'process.env.COMMITHASH': JSON.stringify(commitId),
         'process.env.SUITE_TYPE': JSON.stringify(project),
         'process.env.NODE_ENV': JSON.stringify('development'),
-        'process.browser': true,
         'process.env.ASSET_PREFIX': JSON.stringify(assetPrefix),
         // Polyfill Node.js globals
         global: 'globalThis',
+        // We don't need to explicitly define Buffer here anymore as it's handled by the nodePolyfills plugin
         __DEV__: true,
         ENABLE_REDUX_LOGGER: true,
     },
@@ -206,7 +209,7 @@ export default defineConfig({
     //     },
     // },
     optimizeDeps: {
-        include: ['@trezor/connect', '@trezor/suite'],
+        include: ['@trezor/connect', '@trezor/suite', 'buffer'],
         exclude: [
             // Exclude WebAssembly modules
             '@trezor/crypto-utils',
@@ -217,9 +220,6 @@ export default defineConfig({
                 global: 'globalThis',
             },
             plugins: [
-                NodeGlobalsPolyfillPlugin({
-                    buffer: true,
-                }),
                 {
                     name: 'commonjs',
                     setup(build) {