Angular-cli: Different web workers in the application refer to the one file

[destus90]

🐞 Bug report

Command (mark with an x)

- [ ] new
- [x] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Description

I have created a simple app with two components and two web workers in both of them. After starting the application with the ng serve command, I can't access the different web workers, only one of them. Different paths refer to a single bundle compiled. See the picture

🔬 Minimal Reproduction

git clone https://github.com/destus90/webworkers
npm ci
ng serve

🌍 Your Environment

Angular CLI: 8.0.0
Node: 12.3.1
OS: win32 x64
Angular: 8.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.800.0
@angular-devkit/build-angular     0.800.0
@angular-devkit/build-optimizer   0.800.0
@angular-devkit/build-webpack     0.800.0
@angular-devkit/core              8.0.0
@angular-devkit/schematics        8.0.0
@ngtools/webpack                  8.0.0
@schematics/angular               8.0.0
@schematics/update                0.800.0
rxjs                              6.4.0
typescript                        3.4.5
webpack                           4.30.0

Anything else relevant?

[filipesilva]

@developit this seems to be a bug, do you know what's happening? They should be different bundles because they are from different paths.

[filipesilva]

Yeah this seems to be https://github.com/GoogleChromeLabs/worker-plugin/issues/24. We're blocked waiting on a fix for it.

[developit]

I'm on it! I believe I also have a fix incoming for the incrementing ID issue @filipesilva.

[filipesilva]

Sweet :D

[markgolding]

Hi any idea when this fix will get in release

[developit]

None yet, sorry @markgolding!

[markgolding]

found a workaround for this if you run with "ng serve --prod" then the hashes are added to end of worker names so all works ok.

[destus90]

@markgolding
Indeed, this works. But it is not good running the app with the --prod flag every time, because Terser is realy slow for a large project.

[SteveVanOpstal]

@destus90 @markgolding
No need to serve in production, you can add "outputHashing": "all" to your development configuration in angular.json (or if you don't have that build > options).
Be sure to remove it after this bug is fixed though.

[markgolding]

Cheers @SteveVanOpstal saved me hours of staring a console waiting for rebuilds.

[rt-gavrilov]

According to
https://github.com/GoogleChromeLabs/worker-plugin/issues/24
the workaround for now is:
new Worker('./worker-one', { name: 'one', type: 'module' })
This does work for me. Giving unique names to workers doesn't look like a big deal.

[developit]

Worker Plugin 3.2.0 has been published and includes a fix for this.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}