Aurelia bundling components from plugins with external dependencies

Question

I'm having a very hard time bundling a custom plugin written in typescript using Aurelia. It seems to always fetch the classes from node_modules. I could live with that if it worked but I realized afterward that all components that made use of external libraries never loaded at all. For instance, I have a dialog-box component that make use of aurelia-dialog that never gets loaded and I get no error or anything on the console even though this component worked well before I moved it from my /src folder to an external plugin.

For reference, the index.js generated by the typescript compilation looks like this:

    define(["require", "exports", "./ui/dialog-box", "./ui/message-box", "./attributes/active"], function (require, exports, dialog_box_1, message_box_1, active_1) {
    "use strict";
    exports.DialogBox = dialog_box_1.DialogBox;
    exports.MessageBox = message_box_1.MessageBox;
    exports.ActiveCustomAttribute = active_1.ActiveCustomAttribute;
    function configure(config) {
        config.globalResources(['./ui/empty-state', './ui/tool-bar']);
    }
    exports.configure = configure;
});
//# sourceMappingURL=index.js.map

and the include in my aurelia.json under vendor-bundle looks like this:

{ "name": "sam-aurelia", "path": "../node_modules/sam-aurelia/src", "main": "index" }

So my question is : Does anyone know what could cause these components not to load when they come from a plugin?

Bonus questions:

• How can I debug these kind of problems?
• Why do my components get fetched from node_modules and are not bundled in vendor-bundle?
• Is there an easy way to disable bundling while in development in order to speed up 'compilation' time and ease debugging?

Thanks!

EDITED TO EXPLAIN MY SOLUTION

Sorry I don't have a solution yet for bundling disable or loading debug. As stated in the answer below, setting the 'stub' option to 'true' in my bundle's config (in aurelia.json) prevented the bundling of the html/css files. And it seems adding the glob to load these files helped also. A second problem came from the fact that I didn't export some components in the plugin's index. When I added an export for these components, the html files were correctly bundled. Finally, related to these last files which include an external plugin. I noticed that the browser tried to load their html templates from node_modules/plugin/src/index.html. I suppose it is due to the fact that they are exposed through the index file so aurelia tries to get their templates related to index. Adding these files to the globalresources fixed the problem (although I'm not sure why exactly).

I'm good to go now although I'll probably spend some time putting my code in separate modules and see if adding the components to globalresources is really necessary...

Answer 1

any global resources needs to be exported to be traced, (empty-state and tool-bar). if you have non js files you need to add them to the resources array in aurelia.json:

{
    "name": "sam-aurelia",
    "path": "../node_modules/sam-aurelia/src",
    "main": "index",
    "resources": ["**/*.{html,css}"]
}

and also:

"stub": false