Bundle does not include application code when used with webpack.CommonsChunkPlugin

alavkx commented 6 years ago

I'm submitting a bug report

Library Version: 2.0.0-rc.5
Operating System: Windows 10
Node Version: 9.4.0
NPM Version: 5.6.0
Webpack Version: 3.10.0
Language: Typescript 2.6.2

Current behavior: Bundle does not include application code when used with CommonsChunkPlugin

Expected/desired behavior: Bundle includes application code

webpack.config.js

const path = require("path");
const webpack = require("webpack");
const CleanPlugin = require("clean-webpack-plugin");
const HtmlPlugin = require("html-webpack-plugin");
const InlineManifestPlugin = require("inline-manifest-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const { AureliaPlugin } = require("aurelia-webpack-plugin");

//const appDependencies = require("../package.json").dependencies;
const schedulingDependencies = require("./package.json").dependencies;

module.exports = {
    context: __dirname,
    cache: true,
    entry: {
        scheduling: "aurelia-bootstrapper",
        vendor: Object.keys(schedulingDependencies)
    },
    output: {
        filename: "[name].js",
        path: path.join(__dirname, "dist"),
        publicPath: "/dist/"
    },
    module: {
        rules: [
            { test: /\.json$/, use: [
                { loader: "json-loader" }
            ]},
            { test: /\.html$/i, use: [
                { loader: "html-loader" }
            ]},
            { test: /\.ts$/, exclude: /node_modules/, use: [
                { loader: "awesome-typescript-loader", options: { useCache: true } }
            ]},
            { test: /\.(png|jpe?g|gif|svg)$/, use: [
                { loader: "url-loader", options: { limit: 25000 } }
            ]},
            { test: /[\/\\]node_modules[\/\\]bluebird[\/\\].+\.js$/, use: [
                { loader: "expose-loader", options: "Promise" }
            ]},
        ]
    },
    resolve: {
        extensions: [".ts", ".js"],
        modules: ["lib", "node_modules"],
        alias: {
            lib: path.resolve(__dirname, "../lib")
        }
    },
    plugins: [ 
        new AureliaPlugin({ aureliaApp: undefined }),
        new CleanPlugin(["dist"]),
        new HtmlPlugin({
            filename: "UnifiedScheduling.cshtml",
            template: "../Views/Home/UnifiedScheduling.cshtml"
        }),
        new webpack.NamedModulesPlugin(),
        new InlineManifestPlugin({ name: "webpackManifest "}),
        new webpack.optimize.CommonsChunkPlugin({ names: ["vendor", "manifest"], minChunks: Infinity }),
        new webpack.ProvidePlugin({ "Promise": "bluebird" }),
        new webpack.WatchIgnorePlugin([/\.js$/, /\.d\.ts$/]),
        new webpack.ProgressPlugin()    
    ]
};

UnifiedScheduling.cshtml

<!DOCTYPE html>
<html>
<head></head>
<body>
    <script>
        function loadApp() {
            require.version = "make-sure-aurelia-expects-amd-loader";
            require(['aurelia-bootstrapper', 'i18next-xhr-backend', 'common/core/appSession',
                'common/core/commonAppParameters', 'scheduling/infrastructure/scheduling-app-parameters'],
                function (bootstrapper, Backend, AppSession, CommonAppParameters, SchedulingAppParameters) {
                    //need to register a1 event handlers now - cannot afford to wait until bootstrapper callback is called
                    var session = new AppSession.AppSession('@ViewBag.sessionId', '@ViewBag.baseAppPath');

                    var appParameters = JSON.parse('@Html.Raw(ViewBag.appParametersJson)');

                    bootstrapper.bootstrap(function (aurelia) {
                        aurelia.use
                            .standardConfiguration()
                            //.developmentLogging()
                            .plugin('aurelia-i18n', function (instance) {
                                instance.i18next.use(Backend);
                                return instance.setup({
                                    ns: ['common', 'planning', 'scheduling'],
                                    defaultNS: 'scheduling',
                                    backend: {                                  // <-- configure backend settings
                                        loadPath: '@Url.Content("~/locales/{{lng}}/{{ns}}.json")', // <-- XHR settings for where to get the files from
                                    },
                                    lng: 'en',
                                    attributes: ['t', 'i18n'],
                                    fallbackLng: 'en',
                                    debug: false,
                                    //prevent i18n from translating '/' to '&#x2f;' automatically for date
                                    interpolation: {
                                        escapeValue: false
                                    }
                                });
                            })
                            .plugin('aurelia-dialog')
                            .plugin('aurelia-validation')
                            .plugin('aurelia-resize')
                            .feature('common/form')
                            .feature('common/layout')
                            .feature('common/frame')
                            .globalResources('common/custom-attributes/loading/loading')
                            .globalResources('common/custom-attributes/validation/validation');

                        aurelia.container.registerInstance(AppSession.AppSession, session);
                        aurelia.container.registerInstance(SchedulingAppParameters.SchedulingAppParameters, appParameters);
                        aurelia.container.registerInstance(CommonAppParameters.CommonAppParameters, appParameters);

                        aurelia.loader.textPluginName = 'dojo/text';
                        aurelia.start().then(function () { aurelia.setRoot("scheduling/scheduling-app", document.body); });
                    });
                });
        }

        // Wrapper resource string with bracket
        function wrapperResources(resourceObj) {
            for (var item in resourceObj) {
                if (typeof (resourceObj[item]) === "string") {
                    resourceObj[item] = "[" + resourceObj[item] + "]";
                } else {
                    wrapperResources(resourceObj[item]);
                }
            }
        }

        if (false)//TODO change to true for debugging i18n purpose
        {
            require(["dojo/i18n!app/nls/resources"], function (resources) {
                wrapperResources(resources);
                loadApp();
            });
        }
        else {
            loadApp();
        }
    </script>
    @Html.Raw(htmlWebpackPlugin.files.webpackManifest)
</body>
</html>

jods4 commented 6 years ago

What's the exact difference between the two build? Only removal of CommonChunksPlugin? That would be a bug for Webpack, as CommonChunks is a late stage optimization/reorganization of the chunks. If it drops code you should file a bug in the webpack repo.

Also: what are you trying to achieve with minChunks: Infinity? From the docs: Passing Infinity just creates the commons chunk, but moves no modules into it.

Also also: CommonChunksPlugin was removed from Webpack 4, which will soon-ish be the target of aurelia-webpack-plugin.

alavkx commented 6 years ago

I'll double check that this isn't a configuration error and open a bug with webpack. CommonChunks will be removed and changed to part of the config but I presume under the hood it will be using similar code.

Alexander-Taran commented 6 years ago

@alavkx what did double checking revealed? can we close this?

alavkx commented 6 years ago

I haven't gotten to work on this in a bit, will re-open when I get back to it.

aurelia / webpack-plugin

Bundle does not include application code when used with webpack.CommonsChunkPlugin #137