webpack does not work with latest @ngtools/webpack 6.1.0-rc.1

[manoldonev]

Webpack does not work with latest @ngtools/webpack 6.1.0-rc.1:

08:36:40 ERROR in ../node_modules/nativescript-angular/view-util.js
08:36:40 Module not found: Error: Can't resolve '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/tns-core-modules/utils' in '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/nativescript-angular'
08:36:40  @ ../node_modules/nativescript-angular/view-util.js 2:14-53
08:36:40  @ ../node_modules/nativescript-angular/router/page-router-outlet.js
08:36:40  @ ../node_modules/nativescript-angular/router/router.module.js
08:36:40  @ ../node_modules/nativescript-angular/router/index.js
08:36:40  @ ../platforms/android/app/snapshot-entry.js
08:36:40 
08:36:40 ERROR in ../node_modules/nativescript-angular/router/ns-router-link.js
08:36:40 Module not found: Error: Can't resolve '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/tns-core-modules/utils' in '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/nativescript-angular/router'
08:36:40  @ ../node_modules/nativescript-angular/router/ns-router-link.js 6:14-53
08:36:40  @ ../node_modules/nativescript-angular/router/router.module.js
08:36:40  @ ../node_modules/nativescript-angular/router/index.js
08:36:40  @ ../platforms/android/app/snapshot-entry.js
08:36:40 
08:36:40 ERROR in ../node_modules/tns-core-modules/ui/builder/component-builder/component-builder.js
08:36:40 Module not found: Error: Can't resolve '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/tns-core-modules/utils' in '/home/nsbuilduser/workspace/master-TestsAppNg-android/tests-app-ng/node_modules/tns-core-modules/ui/builder/component-builder'
08:36:40  @ ../node_modules/tns-core-modules/ui/builder/component-builder/component-builder.js 50:20-42
08:36:40  @ ../node_modules/tns-core-modules/ui/builder/builder.js
08:36:40  @ ../node_modules/tns-core-modules/ui/frame/frame.js
08:36:40  @ ../node_modules/tns-core-modules/ui/frame/activity.js
08:36:40  @ ./main.aot.ts

[manoldonev]

We need @ngtools/webpack pre-release version for 979f732#diff-8ddd9c5028c697888286c099d3390459

[manoldonev]

Issue might be related to angular/angular-cli@47f937e#diff-8357b25ceb65af854095a8bf4ee953d0 ?

[manoldonev]

More specifically it seems we now have an issue with (at least) tns-core-modules/ui/package.json and tns-core-modules/utils/package.json:

ERROR in ../node_modules/tns-core-modules/ui/scroll-view/scroll-view.js
Module not found: Error: Can't resolve '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui' in '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/scroll-view'
resolve '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui' in '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/scroll-view'
  using description file: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/scroll-view/package.json (relative path: .)
    using description file: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/package.json (relative path: .)
      no extension
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui is not a file
      .ts
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.ts doesn't exist
      .js
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.js doesn't exist
      .scss
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.scss doesn't exist
      .css
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.css doesn't exist
      as directory
        existing directory
          using path: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index
            using description file: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/package.json (relative path: ./index)
              no extension
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index doesn't exist
              .ts
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.ts doesn't exist
              .js
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.js doesn't exist
              .scss
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.scss doesn't exist
              .css
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.css doesn't exist
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.ts]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.js]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.scss]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui.css]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.ts]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.js]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.scss]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/index.css]
 @ ../node_modules/tns-core-modules/ui/scroll-view/scroll-view.js 7:14-50
 @ ../node_modules/tns-core-modules/bundle-entry-points.js
 @ ./main.ts

ERROR in ../node_modules/nativescript-angular/view-util.js
Module not found: Error: Can't resolve '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils' in '/Users/mdonev/github/blank-ng2/node_modules/nativescript-angular'
resolve '/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils' in '/Users/mdonev/github/blank-ng2/node_modules/nativescript-angular'
  using description file: /Users/mdonev/github/blank-ng2/node_modules/nativescript-angular/package.json (relative path: .)
    using description file: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/package.json (relative path: .)
      no extension
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils is not a file
      .ts
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.ts doesn't exist
      .js
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.js doesn't exist
      .scss
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.scss doesn't exist
      .css
        /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.css doesn't exist
      as directory
        existing directory
          using path: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index
            using description file: /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/package.json (relative path: ./index)
              no extension
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index doesn't exist
              .ts
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.ts doesn't exist
              .js
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.js doesn't exist
              .scss
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.scss doesn't exist
              .css
                /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.css doesn't exist
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.ts]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.js]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.scss]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils.css]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.ts]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.js]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.scss]
[/Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/utils/index.css]
 @ ../node_modules/nativescript-angular/view-util.js 2:14-53
 @ ../node_modules/nativescript-angular/index.js
 @ ./main.ts

Seems webpack was able to correctly resolve module format previously when https://github.com/angular/angular-cli/blob/63389e5028a33ce57d1fb776c1c8bdbd6004324c/packages/ngtools/webpack/src/paths-plugin.ts#L168 did not happen (i.e. it worked with request.request equal to ui/scroll-view and now it does not work when set to "[absolute-app-path]/node_modules/tns-core-modules/ui/scroll-view)

[hansl]

@manoldonev Can you confirm this works (or not) with rc.0?

[hansl]

Seems like it does. You just mentioned rolling back to beta, so I was concerned.

[hansl]

@manoldonev I'd need some reproduction steps to properly identify this. I can revert the 2 commits that affected the file but I'd like to setup an integration test on our side to prevent this regression in the future.

Could you give me instructions on how to get the error above?

(edit: in case you need some context, I'm the lead on the Angular CLI project)

[manoldonev]

@hansl 10x for chiming in.

I am still trying to figure this on our end as well but in short -- we have a folder structure like https://github.com/NativeScript/NativeScript/tree/master/tns-core-modules/ui where the ui folder is not actually a module but https://github.com/NativeScript/NativeScript/blob/master/tns-core-modules/ui/package.json exists with NativeScript specific information. Subdirectories of ui e.g. ui/actionbar, ui/animation are proper modules with their respective package.json. Also, it happens that a stand alone https://github.com/NativeScript/NativeScript/blob/master/tns-core-modules/ui/utils.d.ts in the same ui folder.

At some point while running webpack the paths plugin from @ngtools/webpack receives request to resolve "tns-core-modules/ui/utils" (as originalRequest), with the module resolver this produces /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/utils.d.ts as moduleFilePath in your plugin. But then as noted above your plugin sees that /Users/mdonev/github/blank-ng2/node_modules/tns-core-modules/ui/package.json exists and decides that this must be a module. In our case this particular package.json does not define a module and is unrelated to the utils.d.ts file as far as modules are concerned.

I am working on eliminating such scenarios from our codebase but if you could check whether the package.json contained a "main" field (besides package.json existence) I think we would be good.

[hansl]

Why not add a main field to your package json (e.g. here) so that webpack knows how to resolve as well? It's technically a package.

[hansl]

Normally Angular libraries sub-packages are supposed to follow the fESM format (e.g. https://github.com/angular/angular/blob/master/packages/core/testing/package.json)