Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.

This change is for the runtime chunk, not for css files.

I think it would be enough if the existing test cases passed, and I didn't see any existing tests for the runtime chunk.

So need tests?

@l5oo00 yes

Remove forceHookRuntime option because it relies on the requireExtensions hook inside webpack, so temporarily remove it.

// the `requireExtensions` hook in MainTemplate.js
this.hooks.requireExtensions.tap("MainTemplate", (source, chunk, hash) => {
    const buf = [];
    const chunkMaps = chunk.getChunkMaps();
    // Check if there are non initial chunks which need to be imported using require-ensure
    if (Object.keys(chunkMaps.hash).length) {
        buf.push("// This file contains only the entry chunk.");
        buf.push("// The chunk loading function for additional chunks");
        buf.push(`${this.requireFn}.e = function requireEnsure(chunkId) {`);
        buf.push(Template.indent("var promises = [];"));
        buf.push(
            Template.indent(
                this.hooks.requireEnsure.call("", chunk, hash, "chunkId")
            )
        );
        buf.push(Template.indent("return Promise.all(promises);"));
        buf.push("};");
    }

    // ...
});

And, @evilebottnawi added test for checkCssChunk option.

Any progress? I have found that if we use css-split-webpack-plugin combined with mini-css-extract-plugin, requireEnsure should throw an error as the prior plugin has split them into different files like "xxx-1.css", "xxx-2.css", as "xxx.css" has not been existed already. This option is what I really need to work around this checking

This PR break work mini-css-extract-plugin in many many cases, it is not right solution and contains breaking change

So any proper way to work around such a situation, where I need the plugin not to check CSS chunks when Webpack bootstrap.

@evilebottnawi Or any plan for doing the job of css-split-webpack-plugin within mini-css-extract-plugin?

As we has already generate html to load css statically, we don't need the bootstrap css loading injection (which is after // mini-css-extract-plugin CSS loading)

So we have workarounds like this

config = {
    // ...
    plugins: [
        // ...
        Object.assign(new MiniCssExtractPlugin({filename : config.output.filename.replace(/\.js$/, '.css')}), {
            // extracted css is preloaded, no bootstrap injection required
            // simultaneously workaround the chunk loading problem, see https://github.com/webpack-contrib/mini-css-extract-plugin/pull/256
            getCssChunkObject() { return {} },
        })
        // ...
    ]
}

plugin itself should provider this option (preloaded css statically) in it's own config

updated 2021-08-13

the hack not worked in 2.2.0 now

the above hack is never worked now (version 2.2.0)

since getCssChunkObject is now local and can not be overridden

any other option?

now we have to patch source to remove the whole webpack/runtime/css loading for __webpack_require__.f.miniCss

the new workaround to remove __webpack_require__.f.miniCss

config = {
    // ...
    plugins: [
        new MiniCssExtractPlugin({/* ... */}), { // remove `__webpack_require__.f.miniCss`
            apply(compiler) {
                compiler.hooks.thisCompilation.tap('remove require.f.miniCss', compilation => {
                    compilation.hooks.afterRuntimeRequirements.tap('remove require.f.miniCss', () => {
                        [...compilation.modules].find(x => x.name === 'css loading').generate = () => null;
                    });
                });
            },
        }
    ]
}

the new workaround to remove __webpack_require__.f.miniCss

config = {
    // ...
    plugins: [
        new MiniCssExtractPlugin({/* ... */}), { // remove `__webpack_require__.f.miniCss`
            apply(compiler) {
                compiler.hooks.thisCompilation.tap('remove require.f.miniCss', compilation => {
                    compilation.hooks.afterRuntimeRequirements.tap('remove require.f.miniCss', () => {
                        [...compilation.modules].find(x => x.name === 'css loading').generate = () => null;
                    });
                });
            },
        }
    ]
}

#832