dynamic-dual-import-webpack-plugin
Makes dual import (js chunk + css chunk) for dynamic import and require.ensure.
It works in cooperation with extract-css-chunks-webpack-plugin.
How to setup
1. Add plugins to webpack.config.js:
var ExtractCssChunksPlugin = ;var DynamicDualImportPlugin = ;// ...moduleexports = plugins: // ... filename: '[name].css' cssChunksHashFilename: 'css_chunks_hash.js' // ... ;
2. Add loaders to webpack.plugin.js:
moduleexports = module: rules: // ... test: /\.ts$/ // for example use: DynamicDualImportPlugin loader: 'ts-loader' // ... // ...
3. Include chunks hash into your html:
...
4. After this import()
and require.ensure
will automatically import both .js and .css chunks.
But format have to be:
import /* webpackChunkName: "my-chunk-name" */ // chunk name is mandatory! './my-module'; require; // chunk name is mandatory!