angular / angular-cli

CLI tool for Angular
https://cli.angular.dev
MIT License
26.79k stars 11.98k forks source link

ng18 esbuild-based browser doesn't support .node loading unlike webpack #28781

Closed adumesny closed 1 week ago

adumesny commented 3 weeks ago

Command

build

Is this a regression?

The previous version in which this bug was not present was

ng18 + webpack

Description

went from ng16 to 18.2.8 and manually converting (nx workspace) to new esbuild remain not possible due to 1 blocking issue. can't load .node file

I used this doc which make it sound like a liner changeto use browser-esbuild https://angular.dev/tools/cli/build-system-migration, which is NOT the case. lots of file changed to fix

Minimal Reproduction

Exception or Error

X [ERROR] No loader is configured for ".node" files: node_modules/@node-rs/jieba-win32-x64-msvc/jieba.win32-x64-msvc.node

node_modules/@node-rs/jieba/index.js:104:36:
  104 │ ...        nativeBinding = require('@node-rs/jieba-win32-x64-msvc');

Your Environment

Angular CLI: 18.2.9 Node: 20.15.0 Package Manager: yarn 1.22.22 OS: win32 x64

Angular: 18.2.8 ... animations, common, compiler, compiler-cli, core, forms ... language-service, platform-browser, platform-browser-dynamic ... router

Package Version

@angular-devkit/architect 0.1802.9 @angular-devkit/build-angular 18.2.9 @angular-devkit/core 18.2.9 @angular-devkit/schematics 18.2.9 @angular/cdk 18.2.9 @angular/cli 18.2.9 @angular/material 18.2.9 @schematics/angular 18.2.9 ng-packagr 18.2.1 rxjs 7.8.1 typescript 5.4.5 webpack 5.90.3 zone.js 0.14.10

Anything else relevant?

using the latest version of @node-rs/jieba@1.10.4 which sounds like it made the switch to WASM, which forces install and not suitable alternative > yarn add @node-rs/jieba-wasm32-wasi --ignore-platform as it uses cpu=wasm32

I now get a different error about loading that, which maybe is related to #25102 and require futher code change/re-org which I'm not sure is feasible. having .node support like webpack would make life SO much easier like webpack did out of the box ?

clydin commented 3 weeks ago

This is unfortunately an issue with the package in question. .node files are native Node.js specific code and are not supported by browsers. Attempting to bundle one should result in an error since a browser cannot use the file. Older versions of the package also appear to use several Node.js specific builtins (fs, path, process, etc.). All of which are also not available in a browser. Versions before 1.10 appear to not be intended for use in a browser. However, version 1.10.4 does indeed support browsers via WASM as you mentioned. However, the package uses a non-standard cpu value which prevents usage without a manual installation process. This is a problem that would need to be corrected within the package itself and cannot be addressed by Angular. See https://github.com/napi-rs/node-rs/issues/792 for additional information as the cpu usage appears to be an intentional decision.

adumesny commented 3 weeks ago

@clydin yes, thank you I had read about https://github.com/napi-rs/node-rs/issues/792 which doesn't work as a force install cpu=wasm32 would complain for the next person, build machine so no go. I had filed a ticker for them.

this install stuff is new to me... so path + .node is Node.js only even though we build for browser with "executor": "@angular-devkit/build-angular:browser" in the past and webpack handled it by default but esbuild (even browser-esbuild was not really compatibility replacemenent unlike doc said by any means) ? I'm confused about the output build then. we used NX to build the mostly angular app with clearly some node options cross-env NODE_OPTIONS=--max-old-space-size=10192 nx build --configuration=production

clydin commented 3 weeks ago

The @node-rs/jieba package unfortunately does not work with the browser builder either. With a newly created v18 angular project that is switched to use browser the following occurs.

With "@node-rs/jieba": "^1.10.4":

./src/main.ts:6:12-15 - Error: export 'tag' (imported as 'tag') was not found in '@node-rs/jieba' (module has no exports)

./node_modules/@node-rs/jieba/browser.js:1:0-43 - Error: Module not found: Error: Can't resolve '@node-rs/jieba-wasm32-wasi' in './node_modules/@node-rs/jieba'

After manually installing @node-rs/jieba-wasm32-wasi:

./node_modules/@node-rs/jieba-wasm32-wasi/jieba.wasm32-wasi.wasm?url - Warning: The generated code contains 'async/await' because this module is using "asyncWebAssembly".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

./src/main.ts:6:12-15 - Error: export 'tag' (imported as 'tag') was not found in '@node-rs/jieba' (module has no exports)

./node_modules/@node-rs/jieba-wasm32-wasi/jieba.wasi-browser.js - Error: Module parse failed: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enable it)
File was processed with these loaders:
 * ./node_modules/@angular-devkit/build-angular/src/tools/babel/webpack-loader.js
You may need an additional loader to handle the result of these loaders.
Error: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enable it)

./node_modules/@node-rs/jieba-wasm32-wasi/jieba.wasm32-wasi.wasm?url - Error: Module not found: Error: Can't resolve 'env' in './node_modules/@node-rs/jieba-wasm32-wasi'

./node_modules/@node-rs/jieba-wasm32-wasi/jieba.wasm32-wasi.wasm?url - Error: Module not found: Error: Can't resolve 'wasi_snapshot_preview1' in './node_modules/@node-rs/jieba-wasm32-wasi'

With version 1.9.0:

./node_modules/@node-rs/jieba/index.js:57:11-44 - Warning: Module not found: Error: Can't resolve 'child_process' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:72:28-65 - Warning: Module not found: Error: Can't resolve './jieba.android-arm64.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:74:28-67 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-android-arm64' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:84:28-68 - Warning: Module not found: Error: Can't resolve './jieba.android-arm-eabi.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:86:28-70 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-android-arm-eabi' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:102:28-66 - Warning: Module not found: Error: Can't resolve './jieba.win32-x64-msvc.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:104:28-68 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-win32-x64-msvc' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:114:28-67 - Warning: Module not found: Error: Can't resolve './jieba.win32-ia32-msvc.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:116:28-69 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-win32-ia32-msvc' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:126:28-68 - Warning: Module not found: Error: Can't resolve './jieba.win32-arm64-msvc.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:128:28-70 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-win32-arm64-msvc' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:142:24-64 - Warning: Module not found: Error: Can't resolve './jieba.darwin-universal.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:144:24-66 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-darwin-universal' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:153:28-62 - Warning: Module not found: Error: Can't resolve './jieba.darwin-x64.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:155:28-64 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-darwin-x64' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:165:28-64 - Warning: Module not found: Error: Can't resolve './jieba.darwin-arm64.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:184:24-59 - Warning: Module not found: Error: Can't resolve './jieba.freebsd-x64.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:186:24-61 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-freebsd-x64' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:199:30-68 - Warning: Module not found: Error: Can't resolve './jieba.linux-x64-musl.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:201:30-70 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-x64-musl' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:210:30-67 - Warning: Module not found: Error: Can't resolve './jieba.linux-x64-gnu.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:212:30-69 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-x64-gnu' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:224:30-70 - Warning: Module not found: Error: Can't resolve './jieba.linux-arm64-musl.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:226:30-72 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-arm64-musl' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:235:30-69 - Warning: Module not found: Error: Can't resolve './jieba.linux-arm64-gnu.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:237:30-71 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-arm64-gnu' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:248:28-71 - Warning: Module not found: Error: Can't resolve './jieba.linux-arm-gnueabihf.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:250:28-73 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-arm-gnueabihf' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:261:30-72 - Warning: Module not found: Error: Can't resolve './jieba.linux-riscv64-musl.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:263:30-74 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-riscv64-musl' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:272:30-71 - Warning: Module not found: Error: Can't resolve './jieba.linux-riscv64-gnu.node' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:274:30-73 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-linux-riscv64-gnu' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:290:20-47 - Warning: Module not found: Error: Can't resolve './jieba.wasi.cjs' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:296:22-59 - Warning: Module not found: Error: Can't resolve '@node-rs/jieba-wasm32-wasi' in './node_modules/@node-rs/jieba'

Warning: ./src/main.ts depends on '@node-rs/jieba'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.dev/tools/cli/build#configuring-commonjs-dependencies

./node_modules/@node-rs/jieba/index.js:8:4-17 - Error: Module not found: Error: Can't resolve 'fs' in './node_modules/@node-rs/jieba'

./node_modules/@node-rs/jieba/index.js:11:4-19 - Error: Module not found: Error: Can't resolve 'path' in './node_modules/@node-rs/jieba'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
        - install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "path": false }

./node_modules/@node-rs/jieba-darwin-arm64/jieba.darwin-arm64.node:1:0 - Error: Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
adumesny commented 3 weeks ago

ok, let me go back to (webpack) browser build and look at bundle analyzer to see if it's even included. I know if I exclude "lunr-languages/lunr.zh" (which another module needs) which is the one including @node-rs/jieba then it fails to compile.

"allowedCommonJsDependencies": [
          "lunr-languages/lunr.de",
          "lunr-languages/lunr.es",
          "lunr-languages/lunr.fr",
          "lunr-languages/lunr.it",
          "lunr-languages/lunr.ja",
          "lunr-languages/lunr.ko",
          "lunr-languages/lunr.multi",
          "lunr-languages/lunr.stemmer.support",
          "lunr-languages/lunr.zh",  <--- needs @node-rs/jieba with .node | wasm32 binary
          "lunr-languages/tinyseg",
..
adumesny commented 3 weeks ago

so "lunr' gets included in the webpack bundle, but not seeing any "@node-rs" so looks like webpack is quietly skipping it as I'm not seeing .node files in the /dist folder either. so I just need to make esbuild skip that extension or something... Image

alan-agius4 commented 1 week ago

@adumesny, I’ve also been unable to replicate the issue you mentioned regarding version 1.9.0 of the package failing to bundle with both Webpack and esbuild.

In this instance, the error is expected because the library is simply not compatible with browser environments.

adumesny commented 1 week ago

I guess I need to create a simple example including lurn-language .zh version and see how it behave differently under webpack vs esbuild...

with browser it shoudl exclude .node stuff (not nodejs target) but somehow is included in my esbuild target and fails.