- Rename to critters-webpack-plugin

- Format output using pretty-bytes
- Insert inlined style tags immediately after their source link tags
- Add option to turn off external stylesheet processing
- Add `async` option that converts critical'd external sheets to `<link rel="preload" as="style" onload="this.rel='stylesheet'">`

webpack.config.js

@@ -9,7 +9,7 @@ const PreloadWebpackPlugin = require('preload-webpack-plugin');
 const ReplacePlugin = require('webpack-plugin-replace');
 const CopyPlugin = require('copy-webpack-plugin');
 const WorkboxPlugin = require('workbox-webpack-plugin');
-const HtmlInlineCssPlugin = require('./config/html-webpack-inline-critical-css-plugin');
+const CrittersPlugin = require('./config/critters-webpack-plugin');
 const WatchTimestampsPlugin = require('./config/watch-timestamps-plugin');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
@@ -175,8 +175,11 @@ module.exports = function(_, env) {
 
       // Inject <link rel="preload"> for resources
       isProd && new PreloadWebpackPlugin(),
-      isProd && new HtmlInlineCssPlugin(),
 
+      isProd && new CrittersPlugin({
+        // convert critical'd <link rel="stylesheet"> to <link rel="preload" as="style" onload="this.rel='stylesheet'">
+        async: true
+      }),
 
       // Inline constants during build, so they can be folded by UglifyJS.
       new webpack.DefinePlugin({