search

aurelia / webpack-plugin

A plugin for webpack that enables bundling Aurelia applications.
MIT License
90 stars 36 forks source link

Webpack v 3.0.0-rc.2 throws new Error("PreserveModuleNamePlugin: Unable to find root of module " + name); #113

Closed Alaboudi1 closed 7 years ago

Alaboudi1 commented 7 years ago

I'm submitting a bug report

Please tell us about your environment:

Expected/desired behavior: I know that webpack v3 is still beat but wanted to report this just to let you guys know if there is something you can do on your side.

jods4 commented 7 years ago

Webpack 3 and scope hoisting (ModuleConcatenationPlugin) is on my radar but I have not tested it yet. It is highly likely to not work without some tweaks because you simply can't merge a module that is dynamically loaded by aurelia-loader.

Note that if you are interested in Webpack 3 for other reasons I think you can disable this plugin. Not sure if it'll work or not, as that is not tested either.

Alaboudi1 commented 7 years ago

I have tested Webpack 3 without ModuleConcatenationPlugin and it seems it does work just fine.

pkkummermo commented 7 years ago

Works without it, but it seems that the scope hoisting functionality is one of the flagship features of WP3 and it would've been awesome if it was compatible with Aurelia webpack-plugin :tada:

jods4 commented 7 years ago

That's the plan.

Note that Aurelia will strongly limit the applicability of this feature. Any module loaded by aurelia-loader can't be merged with another.

Even for modules that don't go through aurelia-loader, you might get into trouble. Aurelia dialog already has trouble (that can somehow be worked around) when passed a ViewModel class that doesn't come from aurelia-loader and merged modules will make this worse.

But I still believe this is well worth it for other modules and I really want to get this working! :)

pkkummermo commented 7 years ago

Cool, I'm loving the enthusiasm! :smile: I got a 50kb improvement (in my minified/gzipped bundle) by just upgrading to WP3 and was eager to see "how low can I go" :) Let me know if you want me to test anything, I'd be happy to be a guinea pig.

We're using the Aurelia dialog and have experienced what you just said, and it's understandable that there's limited interopability between the loaders.

jods4 commented 7 years ago

This is fixed in RC3 branch, ModuleConcatenationPlugin is now usable.

pkkummermo commented 7 years ago

Amazing work!

michaelbull commented 7 years ago

@jods4 I've just tried using the plugin from the rc3 branch and am getting the following issue:

/home/michael/code/aurelia-demo/node_modules/aurelia-webpack-plugin/dist/PreserveModuleNamePlugin.js:129
    throw new Error("PreserveModuleNamePlugin: Unable to find root of module " + name);
          ^
Error: PreserveModuleNamePlugin: Unable to find root of module aurelia-templating-router
    at fixNodeModule (/home/michael/code/aurelia-demo/node_modules/aurelia-webpack-plugin/dist/PreserveModuleNamePlugin.js:129:11)
    at Compilation.compilation.plugin.modules (/home/michael/code/aurelia-demo/node_modules/aurelia-webpack-plugin/dist/PreserveModuleNamePlugin.js:25:30)
    at Compilation.applyPlugins1 (/home/michael/code/aurelia-demo/node_modules/tapable/lib/Tapable.js:75:14)
    at sealPart2 (/home/michael/code/aurelia-demo/node_modules/webpack/lib/Compilation.js:596:9)
    at next (/home/michael/code/aurelia-demo/node_modules/tapable/lib/Tapable.js:184:11)
    at /home/michael/code/aurelia-demo/node_modules/extract-text-webpack-plugin/dist/index.js:241:13
    at /home/michael/code/aurelia-demo/node_modules/async/dist/async.js:421:16
    at iteratorCallback (/home/michael/code/aurelia-demo/node_modules/async/dist/async.js:998:13)
    at /home/michael/code/aurelia-demo/node_modules/async/dist/async.js:906:16
    at /home/michael/code/aurelia-demo/node_modules/extract-text-webpack-plugin/dist/index.js:224:15
    at /home/michael/code/aurelia-demo/node_modules/async/dist/async.js:421:16
    at iteratorCallback (/home/michael/code/aurelia-demo/node_modules/async/dist/async.js:998:13)
    at /home/michael/code/aurelia-demo/node_modules/async/dist/async.js:906:16
    at /home/michael/code/aurelia-demo/node_modules/extract-text-webpack-plugin/dist/index.js:213:21
    at rebuilding.forEach.cb (/home/michael/code/aurelia-demo/node_modules/webpack/lib/Compilation.js:504:29)
    at Array.forEach (native)
    at callback (/home/michael/code/aurelia-demo/node_modules/webpack/lib/Compilation.js:504:15)
    at processModuleDependencies (/home/michael/code/aurelia-demo/node_modules/webpack/lib/Compilation.js:523:5)
    at _combinedTickCallback (internal/process/next_tick.js:73:7)
    at process._tickCallback (internal/process/next_tick.js:104:9)
jods4 commented 7 years ago

@michaelbull Did you build the branch yourself? Because dist contents are not committed on the branch.

Using non-published code is slightly more difficult but this was the last change planned for RC3 so hopefully it's going out soon!

michaelbull commented 7 years ago

Ah I presumed they were, that is probably why!

ErikSchierboom commented 7 years ago

I am trying out the RC3 release, but I get the following error:

C:\Projects\test\ui\node_modules\aurelia-webpack-plugin\dist\PreserveModuleNamePlugin.js:38

                        throw new Error(`Can't figure out a normalized module name for ${module.rawRequest}, please call
 PLATFORM.moduleName() somewhere to help.`);
                        ^

Error: Can't figure out a normalized module name for undefined, please call PLATFORM.moduleName() somewhere to help.
    at Compilation.compilation.plugin.modules (C:\Projects\test\ui\node_modules\aurelia-web
pack-plugin\dist\PreserveModuleNamePlugin.js:38:31)
    at Compilation.applyPlugins1 (C:\Projects\test\ui\node_modules\tapable\lib\Tapable.js:7
5:14)
    at sealPart2 (C:\Projects\test\ui\node_modules\webpack\lib\Compilation.js:613:9)
    at Compilation.applyPluginsAsyncSeries (C:\Projects\test\ui\node_modules\tapable\lib\Ta
pable.js:195:46)
    at Compilation.seal (C:\Projects\test\ui\node_modules\webpack\lib\Compilation.js:596:8)

    at applyPluginsParallel.err (C:\Projects\test\ui\node_modules\webpack\lib\Compiler.js:5
14:17)
    at C:\Projects\test\ui\node_modules\tapable\lib\Tapable.js:289:11
    at _addModuleChain (C:\Projects\test\ui\node_modules\webpack\lib\Compilation.js:498:11)

    at processModuleDependencies.err (C:\Projects\test\ui\node_modules\webpack\lib\Compilat
ion.js:468:14)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)

Obviously, I'm doing something wrong, but what could it be?

jods4 commented 7 years ago

I can't tell from the error...

Usually the hint is right there: Can't figure out a normalized module name for undefined

Having undefined as the raw request for a module is weird. If you debug the build you could try to look at other properties from the module object to figure out what it is / where it comes from.

ErikSchierboom commented 7 years ago

Okay, I'll see what I can find.

smax48 commented 7 years ago

I have the same error with RC3 in my webpack build if I enable ModuleConcatenationPlugin. I tried to debug the webpack build, and I can see that the failing module is probably validate-binding-behavior from aurelia-validation. I use the latest version of that library. In my main.ts I enable it using:

        .plugin(PLATFORM.moduleName("aurelia-validation"))

Also in aurelia-validation sources I can see that it uses PLATFORM.moduleName() to define global resources, so I have no idea why this error happens.

jods4 commented 7 years ago

@smax48 By "same error" do you mean the "undefined" module error: Can't figure out a normalized module name for undefined

I would be interested in a simple repro.

smax48 commented 7 years ago

Yes, I meant "Can't figure out a normalized module name for undefined, please call PLATFORM.moduleName() somewhere to help." The repro is quite simple - take the latest skeleton-typescript-webpack, update aurelia-webpack-plugin to rc3 there and install the latest aurelia-validation. (I also installed the latest webpack 3.5.5, but not sure this is relevant). In main.ts enable aurelila-validation (.plugin(PLATFORM.moduleName("aurelia-validation"))) Of course, add a ModuleConcatenationPlugin to the webpack config. That's all. Build fails with the above error.

jp7677 commented 7 years ago

Hi @jods4 Here is a simple repository that produces the exact error @ErikSchierboom describes. https://github.com/jp7677/hellocoreclr/tree/ModuleConcatenationPlugin/ui

Please make sure that you check out the ModuleConcatenationPlugin branch and browse to the ui folder. An npm install followed by npm run build should trigger the error. Note that everything builds and runs fine without the ModuleConcatenationPlugin. Please let me know if I can assist any further.

Btw, thank you very much for your work here. Using Aurelia together with webpack 3 is such fun to use and is really the way forward for me!

jods4 commented 7 years ago

Thanks @jp7677. It really helps to have a simple demonstration of problems that I can clone.

I'll debug the build to see which modules creates that error and if I can make a better error report -- or fix it ;)

jods4 commented 7 years ago

Thanks for the repro.

It is a bug triggered by ConcatenatedModule indeed. An Aurelia module can still be the root of a concatenated module (and only the root). When this happens, it triggers the Can't figure out a normalized name for undefined error described above (up to RC4).

Good news is that I fixed it in master, we only need to wait for @EisenbergEffect to make a patch release. Here's the output with the patch applied: image

smax48 commented 7 years ago

It looks like RC5 fixes this build problem. Thanks!

jp7677 commented 7 years ago

@jods4 Very cool, thanks a lot!

pkkummermo commented 7 years ago

Confirmed no errors on RC5, haven't really done any perf tests yet :) Also, a friendly heads up for people using HMR, it doesn't play well with ModuleConcatenationPlugin

pkkummermo commented 7 years ago

Seems there are some problems with aurelia-dialog with version

"aurelia-dialog": "^1.0.0-rc.1.0.3",

I'm getting Unhandled rejection TypeError: Cannot read property 'attached' of null bluebird:1542

webpack:

    "webpack": "^3.4.1",
    "webpack-dev-server": "^2.6.1"

Just a heads up as the build is fine, but loads incorrectly in browser. I probably should add an issue on it instead of commenting on a closed issue. I'm going to debug it abit more first :)

Edit: Getting interesting as it's only some dialogs. Oh boy, funday monday.

Note: This is only a issue when dropping in ModuleConcatenationPlugin in my webpack-config

jods4 commented 7 years ago

@pkkummermo I'm pretty sure you're hitting aurelia/dialog#298. Don't ES import your dialog ViewModels, refer to them by name + moduleName.

jods4 commented 7 years ago

ModuleConcatenationPlugin is very likely to break HMR, indeed. Maybe you should open an issue in its repo. That said, HMR is meant for developing only, maybe you can disable module concatenation in dev environment?

pkkummermo commented 7 years ago

Yup, that's what I did (if prod -> moduleConcat) :)

I'll try to add Platform.moduleName to the import, but the fun part is that on a shared view, one viewmodel works, but the other one breaks. I'll test abit and report :+1:

pkkummermo commented 7 years ago

@jods4 My man!

A simple

this.dialogService.open({ viewModel: PLATFORM.moduleName('Dialogs/createApplicationDialog') })

fixed stuff. I'll just go through all my dialogs and fix them according to the "correct way" to avoid further problems.

ErikSchierboom commented 7 years ago

I can confirm that RC5 also fixed my problem! Thanks.