Unable to run extract-i18n command due to sourcemapping error

[mattlewis92]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• extract-i18n
• run
• config
• help
• version
• doc

Is this a regression?

Yes, the previous version in which this bug was not present was: 12.2.6 (the bug got introduced somewhere in a patch version of v12 as it's present in the latest version of v12 as well as all versions of v13)

Description

When running the extract-i18n command it fails as there is an invalid sourcemap in the dependency tree.

This is what the sourcemap looks like:

{"version":3,"sources":["webpack://[name]/webpack/universalModuleDefinition", ...rest], ...rest}

I'm also going to open an issue with the maintainers of the troublesome dependency to try and get them to fix it on their end, but I guess the CLI should handle invalid sourcemaps rather than crashing like this.

🔬 Minimal Reproduction

git checkout git@github.com:mattlewis92/source-map-bug.git
cd source-map-bug
npm i # Note: the dependency is a private npm dependency, if you can let me know your npm handle then I can grant you access so you can npm install it
npm run extract-i18n

🔥 Exception or Error

./node_modules/@clickup/gantt/codebase/dhtmlxgantt.js - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js):
TypeError [ERR_INVALID_URL]: Invalid URL
    at new NodeError (node:internal/errors:371:5)
    at onParseError (node:internal/url:552:9)
    at new URL (node:internal/url:628:5)
    at normalizeSimplePath (/Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:301:26)
    at normalizePath (/Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:320:20)
    at resolve (/Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:386:26)
    at resolve$1 (/Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:418:16)
    at /Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:737:25
    at Array.map ()
    at buildSourceMapTree (/Users/mattlewis/Code/open-source/source-map-bug/node_modules/@ampproject/remapping/dist/remapping.umd.js:734:34)

🌍 Your Environment

Angular CLI: 13.1.3
Node: 16.13.1
Package Manager: npm 6.14.15
OS: darwin arm64

Angular: 13.1.2
... animations, common, compiler, compiler-cli, core, elements
... forms, language-service, localize, platform-browser
... platform-browser-dynamic, router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1301.2
@angular-devkit/build-angular   13.1.3
@angular-devkit/core            13.1.2
@angular-devkit/schematics      13.1.2
@angular/cdk                    13.1.1
@angular/cli                    13.1.3
@angular/google-maps            12.2.1
@schematics/angular             13.1.3
ng-packagr                      13.1.2
rxjs                            7.4.0
typescript                      4.5.4

Anything else relevant?

[alan-agius4]

My NPM username is alan.agius4.

[mattlewis92]

My NPM username is alan.agius4.

Added you!

[alan-agius4]

Indeed this is an issue with the vendor sourcemaps and the reason why this is only visible during i18n extraction in your project vendor sourcemaps are only used by the i18n extraction builder.

Likely @ampproject/remapping should not crash in this case. I'll open an issue in their repo and see what they think.

[jridgewell]

I'm the maintainer of @ampproject/remapping. Unfortunately I get an error running npm install:

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@clickup/gantt/-/gantt-7.1.8.tgz - Not found
npm ERR! 404
npm ERR! 404  '@clickup/gantt@https://registry.npmjs.org/@clickup/gantt/-/gantt-7.1.8.tgz' is not in this registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

Is @clickup/gantt a private package? I'm jridgewell on npm, can you grant me access to the @clickup/gantt package?

Can you comment whether there's a sourceRoot in this sourcemap? Is this the root map (ie, one that's directly passed to remapping()), or a transitive map (eg, a root map points to it)?

[mattlewis92]

@jridgewell thanks for looking into this!

I'm jridgewell on npm, can you grant me access to the @clickup/gantt package?

Done!

Can you comment whether there's a sourceRoot in this sourcemap?

The sourceRoot property is set to an empty string in the sourcemap

Is this the root map (ie, one that's directly passed to remapping()), or a transitive map (eg, a root map points to it)?

It's the root map of the npm package