aurelia / bundler

A library for bundling JavaScript, HTML and CSS for use with SystemJS.
MIT License
37 stars 25 forks source link

bundling with minify results in error with AMD module loading #141

Closed gravsten closed 7 years ago

gravsten commented 8 years ago

Bundling minifies JavaScript (how ? in bundler.js the function createFetchHook() seems to handle only HTML and CSS), thus replacing define by a single-character.

The problem is that SystemJS looks for define for selecting the AMD format. As a result, SystemJS falls back on the CJS format, thus triggering a separate dependency from the AMD defined dependency (this JS library is multiformat).

Then, Aurelia app can't load, as it is left hanging with only the splash screen and absolutely no console output because of this unsatisfied dependency. Note: the exact same app built without minify works perfectly.

Ideally I would have liked to tell the minifier to exclude define from mangling, but I couldn't find where the JS minification is handled (see comment above).

My current workaround is to tell SystemJS how to recognize the mangled AMD signature.

XuJinNet commented 8 years ago

The same problem? [Bug][skeleton-esnext] Bundle with "moment", can`t find the module moment when set "minify" to true #672

gravsten commented 8 years ago

If 'moment' is an AMD-formatted library, then yes most likely it is the same problem.

XuJinNet commented 8 years ago

Yes, the "moment" is AMD format.

ahmedshuhel commented 8 years ago

@gravsten Could you please point me to a Github repo that reproduces this bug? It would be a great help for me to debug and fix it. Thank you.

gravsten commented 8 years ago

I started with the skeleton app here: https://github.com/adarshpastakia/aurelia-ui-framework/archive/skeleton.zip

This is a TypeScript app, but I added some pure JavaScript libraries in AMD format, which caused the problem when minifying the app.

As far as I remember, the on which the skeleton app is based also depends on some pure JavaScript libraries (included in aurelia-ui-framework@2.1.4/libs/) that experienced the same problem when minifying the framework.

Unfortunately, my app is not open source and thus I have no Github repo to point you to beside the above. I suggest you download the skeleton app, install all dependencies (with ./init.sh or ./init.bat), and try to run the packager (gulp production) with minifying enabled.

To be entirely transparent, the workaround mentioned in my earlier post consists in replacing: /(?:^\uFEFF?|[^$_a-zA-Z\xA0-\uFFFF.])define\s*\(\s*( with: /(?:^\uFEFF?|[^$_a-zA-Z\xA0-\uFFFF.])(define|var a=System.amdDefine;a)\s*\(\s*(

This regex string is truncated for clarity, the rest of it remaining unchanged. It may not be the most elegant solution, but it works for me.

ahmedshuhel commented 8 years ago

@gravsten Thank you for writing back. I am having difficulties reproducing this bug. I understand your concern about your project not being open source. Could you please consider creating a new repo(not your project) with some dummy code just enough that reproduces this bug?

XuJinNet commented 8 years ago

@ahmedshuhel import the module moment, may reproducing this bug. https://github.com/aurelia/skeleton-navigation/issues/672

ahmedshuhel commented 8 years ago

@XuJinNet Will try that. But could you please share how you configured (SystemJS config) and consumed moment?