Compile error caused by a node module

[magic-akari]

System Info

  System:
    OS: macOS 14.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 94.67 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.10.0 - ~/Library/Caches/fnm_multishells/76248_1702736941772/bin/node
    Yarn: 3.3.1 - ~/Library/Caches/fnm_multishells/76248_1702736941772/bin/yarn
    npm: 10.2.3 - ~/Library/Caches/fnm_multishells/76248_1702736941772/bin/npm
    pnpm: 8.12.1 - ~/Library/Caches/fnm_multishells/76248_1702736941772/bin/pnpm
    bun: 1.0.6 - ~/.bun/bin/bun
  Browsers:
    Chrome: 120.0.6099.109
    Safari: 17.2

Details

Key words:

• resolver
• node module

Related codes:

export async function foo(input) {
  switch (true) {
    case typeof input === 'string':
      input = new URL(input, import.meta.url);
    case input instanceof URL:
      if (typeof __webpack_require__ !== 'function' && input.protocol === 'file:') {
        const fs = await import('node:fs/promises');
        input = fs.readFile(input);
        break;
      }
    case typeof Request === 'function' && input instanceof Request:
      input = fetch(input);
  }
}

Real-world issue:

This code snippet is using in @wasm-fmt/ruff_fmt . Therefore, importing this library may result in compilation errors.

Reproduce link

No response

Reproduce Steps

1. Create project via cli using Vanilla template

   
   ❯ pnpm create rsbuild@latest

◆ Create Rsbuild Project │ ◇ Input target folder │ my-project │ ◇ Select framework │ Vanilla │ ◇ Select language │ JavaScript │ ◇ Next steps ────╮ │ │ │ cd my-project │ │ pnpm i │ │ pnpm run dev │ │ │ ├─────────────────╯ │ └ Done.

2. Replace the content in `src/index.js` with the code snippet mentioned above.
3. pnpm i
4. pnpm build

You will get the error

rsbuild-vanilla-js@1.0.0 build /Users/akari/Developer/my-project rsbuild build

Rsbuild v0.2.5

start Use Rspack v0.4.3 ● Client ━━━━━━━━━━━━━━━━━━━━━━━━━ (100%) done error Compile error: Failed to compile, check the errors for troubleshooting. × No such file or directory (os error 2), failed to read

error Failed to build. error Rspack build failed! at /Users/akari/Developer/my-project/node_modules/.pnpm/@rsbuild+core@0.2.5/node_modules/@rsbuild/core/dist/provider/core/build.js:32:35 at finalCallback (/Users/akari/Developer/my-project/node_modules/.pnpm/@rspack+core@0.4.3/node_modules/@rspack/core/dist/Compiler.js:335:21) at /Users/akari/Developer/my-project/node_modules/.pnpm/@rspack+core@0.4.3/node_modules/@rspack/core/dist/Compiler.js:359:40 at Hook.eval [as callAsync] (eval at create (/Users/akari/Developer/my-project/node_modules/.pnpm/tapable@2.2.1/node_modules/tapable/lib/HookCodeFactory.js:33:10), :24:1) at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/Users/akari/Developer/my-project/node_modules/.pnpm/tapable@2.2.1/node_modules/tapable/lib/Hook.js:18:14) at /Users/akari/Developer/my-project/node_modules/.pnpm/@rspack+core@0.4.3/node_modules/@rspack/core/dist/Compiler.js:354:41 at /Users/akari/Developer/my-project/node_modules/.pnpm/@rspack+core@0.4.3/node_modules/@rspack/core/dist/Compiler.js:391:21  ELIFECYCLE  Command failed with exit code 1.

[xc2]

Minimal reproduce

// rspack.config.js
module.exports = {
  entry: "./src/index.js",
  target: "web", // "node" works, but `@wasm-fmt/ruff_fmt` is meant to work on both browser and node.
}

// src/index.js
import * as a from "@wasm-fmt/ruff_fmt";
console.log(a);

https://github.com/xc2/rspack-usecases/tree/4ccd5b476d21f6d68b4ae4a09eff82f2f88ef832/rspack/conditional-import

Webpack

Target	Webpack	Rspack
web	✅	❌
node	✅	✅

[LingyuCoder]

Relate to #4424

The result of typeof __webpack_require__ !== 'function' is always false, so the code under the if condition statement should not be parsed. This can be resolved by fully implementing compile-time evaluation. cc @bvanjoi