css-async-process-webpack-plugin
A webpack plugin for change the insert position of async loading style which is generated by mini-css-extract-plugin
Install
npm i -D css-async-process-webpack-pluginNOTE: Should add after
mini-css-extract-plugin
Usage
In your webpack configuration (webpack.config.js):
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CssAsyncProcessWebpackPlugin = require('css-async-process-webpack-plugin');
module.exports = {
//...
plugins: [
new MiniCssExtractPlugin({
filename: "[name].[hash:8].css",
chunkFilename: "[id].[hash:8].css"
}),
new CssAsyncProcessWebpackPlugin(),
]
}Options
process
Function.
Change the async loading style insert before document.getElementById("less:theme:color") by default.
You can change the logic by setting process.
new CssAsyncProcessWebpackPlugin({
process: (source) => {
return source.replace(/head.appendChild\(linkTag\)/, 'head.insertBefore(linkTag, document.getElementById("less:theme:color"))');
}
}),