drop support for Webpack v3

Author: brunocodutra

.travis.yml

@@ -15,17 +15,13 @@ stages:
 env:
   global:
     secure: dHZkfjL0eagnG2UBm4cR3DVFgwyPAc4gr48sBfIPrdee6Zm3uz9ctQcSjTmKtOKKQd0g4BNMTgvpi44JuZX79N67fygWmWMCSKSPInkSsnPJLOVArhC0F+T8Eei19hwaARwFZ++MCmsIUoyFtjLsCaG4tO+6jM1uu/0FXDwL//XcYZefMRLMzGv1j3RLJk9dQfY6InilCEqjvcbMlktNbECJs04GVWSl3RsYTffHYUft+0qrwKKA+eDKLCf3qC5hJ6TLW0foF+fNu16jh/gZtw94b8dhpdEqd9gO0bXz4/jt+sI+ubczio0IX1EdG2WLFJxPQvVNz38Bqof1fBe3hesL64rsr3PFuCPs8kdMIHHkKoDLfRS/K/3+PW25XteHkFOEi8UJg6BB5sw1zDhqKc42gybMDphYOIkUkdoNMbUmFJKJy01pP7jqP45ye0sXL0Gff3YPZGfVry7gK+Bh63esQEaCnPrScrdpB8ycKW+KS+ddv6KWUNdQKSHsEWtikQ505WYHtqZ81XIMP6HXLV3H/lMRfT43NOALUBpauuJ+JXM5f1yl8rSJHY0YoA2CUScmUrgJLQ5KsBdRPq5GXS7TKTuRZ7O7J/yWoAys2ok8BOAiq5sths+oZ7LMAgHkTLeik67arWTVvy+wiDcXpMpcak3W8pm8cdNDbVu96WM=
-  matrix:
-  - TARGET="webpack@3 html-webpack-plugin@2"
-  - TARGET="webpack@4 html-webpack-plugin@3"
 
 jobs:
   include:
   - name: coverage
     stage: check
     os: linux
     node_js: node
-    env: []
     script: travis_retry npm run coverage
     after_success:
     - travis_retry npm install coveralls
@@ -34,7 +30,6 @@ jobs:
   - stage: deploy
     os: linux
     node_js: node
-    env: []
     script: skip
     deploy:
       provider: npm
@@ -49,7 +44,6 @@ jobs:
     if: type = pull_request
     os: linux
     node_js: node
-    env: []
     script:
     - |
       if [[ -n $(git diff --name-only package-lock.json) ]]
@@ -68,7 +62,6 @@ before_install:
 
 install:
 - travis_retry npm install
-- travis_retry npm install ${TARGET}
 
 before_script:
 - git config --global user.name "Travis Bot"

appveyor.yml

@@ -1,16 +1,11 @@
 environment:
   nodejs_version: "Current"
 
-  matrix:
-  - TARGET: "webpack@3 html-webpack-plugin@2"
-  - TARGET: "webpack@4 html-webpack-plugin@3"
-
 install:
 - ps: Install-Product node $env:nodejs_version x64
 
 - appveyor-retry npm install -g npm@latest
 - appveyor-retry npm install
-- appveyor-retry npm install %TARGET%
 
 test_script:
 - appveyor-retry npm test

package-lock.json

@@ -48,7 +48,6 @@
   },
   "dependencies": {
     "cache-loader": "^4.0.1",
-    "camelcase": "^5.3.1",
     "favicons": "5.4.1",
     "find-cache-dir": "^3.0.0",
     "find-root": "^1.1.0",
@@ -58,7 +57,7 @@
     "tapable": "^1.1.3"
   },
   "peerDependencies": {
-    "webpack": "^3.0.0 || ^4.0.0"
+    "webpack": "^4.0.0"
   },
   "ava": {
     "files": [

package.json

@@ -3,11 +3,10 @@ const msgpack = require('msgpack-lite');
 const findCacheDir = require('find-cache-dir');
 const { AsyncSeriesWaterfallHook } = require('tapable');
 const SingleEntryPlugin = require('webpack/lib/SingleEntryPlugin');
-const { getAssetPath, trigger } = require('./compat');
 
 const wwp = 'webapp-webpack-plugin';
 
-module.exports.run = ({ prefix, favicons: options, logo, cache, publicPath: publicPathOption, outputPath }, context, compilation) => {
+module.exports.run = async ({ prefix, favicons: options, logo, cache, publicPath: publicPathOption, outputPath }, context, compilation) => {
   // The entry file is just an empty helper
   const filename = '[hash]';
   const publicPath = publicPathOption || compilation.outputOptions.publicPath || '/';
@@ -38,32 +37,30 @@ module.exports.run = ({ prefix, favicons: options, logo, cache, publicPath: publ
   }
 
   // Compile and return a promise
-  return new Promise((resolve, reject) => {
-    compiler.runAsChild((err, [chunk] = [], { hash, errors = [], assets = {} } = {}) => {
+  const { chunk, hash, assets } = await new Promise((resolve, reject) => {
+    return compiler.runAsChild((err, [chunk] = [], { hash, errors = [], assets = {} } = {}) => {
       if (err || errors.length) {
         return reject(err || errors[0].error);
       }
 
-      // Replace [hash] placeholders in filename
-      const output = getAssetPath(compilation, filename, { hash, chunk });
-      const result = msgpack.decode(Buffer.from(eval(assets[output].source()), 'base64'));
+      return resolve({ chunk, hash, assets });
+    });
+  });
 
-      delete compilation.assets[output];
+  // Replace [hash] placeholders in filename
+  const output = compilation.mainTemplate.getAssetPath(filename, { hash, chunk });
+  const result = msgpack.decode(Buffer.from(eval(assets[output].source()), 'base64'));
 
-      trigger(compilation, 'webapp-webpack-plugin-before-emit', result, (error, { tags = [], assets = [] } = {}) => {
-        if (error) {
-          return reject(error);
-        }
+  delete compilation.assets[output];
 
-        for (const { name, contents } of assets) {
-          compilation.assets[name] = {
-            source: () => contents,
-            size: () => contents.length,
-          };
-        }
+  const { tags, assets: files } = await compilation.hooks.webappWebpackPluginBeforeEmit.promise(result);
 
-        return resolve(tags);
-      });
-    });
-  });
+  for (const { name, contents } of files) {
+    compilation.assets[name] = {
+      source: () => contents,
+      size: () => contents.length,
+    };
+  }
+
+  return tags;
 };

src/compat.js

@@ -2,7 +2,6 @@ const assert = require('assert');
 const path = require('path');
 const child = require('./compiler');
 const Oracle = require('./oracle');
-const { tap, tapHtml } = require('./compat');
 
 module.exports = class WebappWebpackPlugin {
   constructor(args) {
@@ -64,25 +63,25 @@ module.exports = class WebappWebpackPlugin {
         || htmlPlugin.options.favicons !== false && htmlPlugin.options.inject && inject;
     }
 
-    tap(compiler, 'make', 'WebappWebpackPlugin', async (compilation, callback) => {
+    compiler.hooks.make.tapPromise('WebappWebpackPlugin', async compilation => {
       try {
         // Generate favicons
         const tags = await child.run(this.options, compiler.context, compilation);
         this.tags.resolve(tags);
 
         // Hook into the html-webpack-plugin processing and add the html
-        tapHtml(compilation, 'WebappWebpackPlugin', (htmlPluginData, callback) => {
-          if (this.options.inject(htmlPluginData.plugin)) {
-            const idx = (htmlPluginData.html + '</head>').search(/<\/head>/i);
-            htmlPluginData.html = [htmlPluginData.html.slice(0, idx), ...tags, htmlPluginData.html.slice(idx)].join('');
-          }
-          return callback(null, htmlPluginData);
-        });
-        return callback();
-
+        if (compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing) {
+          await compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tapPromise('WebappWebpackPlugin', async htmlPluginData => {
+            if (this.options.inject(htmlPluginData.plugin)) {
+              const idx = (htmlPluginData.html + '</head>').search(/<\/head>/i);
+              htmlPluginData.html = [htmlPluginData.html.slice(0, idx), ...tags, htmlPluginData.html.slice(idx)].join('');
+            }
+            return htmlPluginData;
+          });
+        }
       } catch (err) {
         this.tags.reject(err);
-        return callback(err);
+        throw err;
       }
     });
   }

src/compiler.js

@@ -2,32 +2,24 @@ const url = require('url');
 const favicons = require('favicons');
 const msgpack = require('msgpack-lite');
 const { parseQuery, interpolateName } = require('loader-utils');
-const { getContext } = require('./compat');
 const pkg = require('../package.json')
 
 const trailingSlash = (path) => (path.substr(-1) !== '/') ? path + '/' : path;
 
 module.exports = async function (content) {
-  /* istanbul ignore next */
-  if (!this.async) throw new Error('async is required');
-
-  const callback = this.async();
   const query = parseQuery(this.query);
   const path = query.path && trailingSlash(query.path);
   const prefix = query.prefix && trailingSlash(interpolateName(this, query.prefix, {
-    context: getContext(this),
+    context: this.rootContext,
     content: msgpack.encode([content, query.options, pkg.version]), // hash must depend on logo + config + version
   }));
+
   const outputPath = query.outputPath ? trailingSlash(query.outputPath) : prefix;
 
-  try {
-    // Generate icons
-    const { html: tags, images, files } = await favicons(content, Object.assign(query.options, { path: url.resolve(path, prefix) }))
-    const assets = [...images, ...files].map(({ name, contents }) => ({ name: outputPath + name, contents }));
-    return callback(null, `module.exports = '${msgpack.encode({ tags, assets }).toString('base64')}'`);
-  } catch (err) {
-    return callback(err);
-  }
+  // Generate icons
+  const { html: tags, images, files } = await favicons(content, Object.assign(query.options, { path: url.resolve(path, prefix) }))
+  const assets = [...images, ...files].map(({ name, contents }) => ({ name: outputPath + name, contents }));
+  return `module.exports = '${msgpack.encode({ tags, assets }).toString('base64')}'`
 };
 
 module.exports.raw = true;

src/index.js

@@ -1,11 +1,4 @@
 module.exports = async function () {
-  const callback = this.async();
-  const { plugin } = this.query;
-
-  try {
-    const tags = await plugin.tags.promise;
-    return callback(null, `module.exports = ['${tags.join("', '")}'];`);
-  } catch (err) {
-    return callback(err);
-  }
+  const tags = await this.query.plugin.tags.promise;
+  return `module.exports = ['${tags.join("', '")}'];`;
 };

src/loader.js

@@ -3,7 +3,7 @@ const path = require('path');
 const fs = require('fs-extra');
 const WebappWebpackPlugin = require('../');
 
-const { logo, generate, mkdir, compare, expected, tap } = require('./util');
+const { logo, generate, mkdir, compare, expected } = require('./util');
 
 test.beforeEach(async t => t.context.root = await mkdir());
 
@@ -20,14 +20,12 @@ test('should trigger webappWebpackPluginBeforeEmit hook', async t => {
       new WebappWebpackPlugin({ logo }),
       new class {
         apply(compiler) {
-          tap(compiler, "make", "Plugin", (compilation, callback) => {
-            tap(compilation, "webapp-webpack-plugin-before-emit", "Plugin", (result, callback) => {
+          compiler.hooks.make.tapPromise('Test', async compilation =>
+            compilation.hooks.webappWebpackPluginBeforeEmit.tapPromise('Test', async result => {
               t.pass();
-              return callback(null, result);
-            });
-
-            return callback();
-          })
+              return result;
+            })
+          );
         }
       },
     ]