Fix Chunk.modules DeprecationWarning in Webpack 3.x

Updates to Chunk.mapModules is not backwards compatible with Webpack 2.x due to breaking changes in webpack/webpack#4764

.gitignore

@@ -1,2 +1,4 @@
+/.idea
+
 /node_modules
-/npm-debug.log
+/npm-debug.log

Plugin.js

@@ -1,8 +1,11 @@
-'use strict';
+'use strict'
 
 class ExtractFilePlugin {
+
     apply(compiler) {
+
         compiler.plugin('this-compilation', (compilation) => {
+
             compilation.plugin('normal-module-loader', (loaderContext, module) => {
                 loaderContext[__dirname] = () => {
                     module.meta[__dirname] = true;
@@ -11,7 +14,7 @@ class ExtractFilePlugin {
 
             compilation.plugin('additional-assets', callback => {
                 compilation.chunks.forEach(chunk => {
-                    chunk.modules.forEach(module => processModule(chunk, module));
+                    chunk.forEachModule(module => processModule(chunk, module));
                 });
 
                 callback();
@@ -21,22 +24,28 @@ class ExtractFilePlugin {
 }
 
 function processModule(chunk, ourModule) {
+
     if (ourModule.meta && ourModule.meta[__dirname]) {
+
+        let moduleFound = false;
+
         // let's find module, which was issued by ours (proxied module)
-        chunk.modules.some((module) => {
-            if (module.reasons.some(reason => reason.module === ourModule)) {
+        chunk.forEachModule((module) => {
+
+            if (!moduleFound && module.reasons.some(reason => reason.module === ourModule)) {
                 // add assets from that module
                 addAssets(chunk, module);
                 // break cycle
-                return true;
+                moduleFound = true;
             }
         });
     }
 }
 
 function addAssets(chunk, module) {
+
     // add any emitted assets via proxied module to this chunk
-    for (var file in module.assets) {
+    for (let file in module.assets) {
         chunk.files.push(file);
     }
 }

README.md

@@ -9,6 +9,15 @@ not added to the chunk files
 - this loader is used as a proxy to include this emitted file in the chunk
 so it's available in generated manifest
 
+# Install
+
+```bash
+# for webpack 3
+npm install --save-dev extract-text-webpack-plugin
+# for webpack 1, 2
+npm install --save-dev extract-text-webpack-plugin@0.1.0
+```
+
 ## Usage
 
 ```js

package.json

@@ -1,17 +1,17 @@
 {
     "name": "extract-file-loader",
-    "version": "0.1.0",
+    "version": "0.2.0",
     "author": "Marius Balčytis",
     "description": "Loader and plugin for webpack to add proxied asset as a chunk file",
     "dependencies": {
         "loader-utils": "~0.2.5"
     },
     "devDependencies": {
-        "assets-webpack-plugin": "^3.2.0",
-        "file-loader": "^0.8.4",
-        "image-webpack-loader": "^2.0.0",
+        "assets-webpack-plugin": "^3.5.0",
+        "file-loader": "^1.0.0-rc",
+        "image-webpack-loader": "^3",
         "mocha": "^3.0.2",
-        "webpack": "^1.13.2"
+        "webpack": "^3"
     },
     "engines": {
         "node": ">=4"

test/webpack.config.js

@@ -3,30 +3,33 @@ const AssetsPlugin = require('assets-webpack-plugin');
 const outputDir = __dirname + '/output';
 
 module.exports = {
-    resolve: {
-        alias: {
-            '@root': __dirname
-        }
-    },
-    entry: {
-        image: __dirname + '/../index?q=@root/cat.png!'
-    },
-    output: {
-        path: outputDir,
-        filename: 'result.js',
-    },
-    plugins: [
-        new ExtractFilePlugin(),
-        new AssetsPlugin({filename: 'manifest.json', path: outputDir})
-    ],
-    module: {
-        preLoaders: [{
-            test: /\.(gif|png|jpe?g|svg)$/i,
-            loader: 'image-webpack'
-        }],
-        loaders: [{
-            test: /\.(gif|png|jpe?g|svg)$/i,
-            loader: 'file?name=[name].optimized.[ext]'
-        }]
-    }
-};
+	resolve: {
+		alias: {
+			'@root': __dirname
+		}
+	},
+	entry: {
+		image: __dirname + '/../index?q=@root/cat.png!'
+	},
+	output: {
+		path: outputDir,
+		filename: 'result.js',
+	},
+	plugins: [
+		new ExtractFilePlugin(),
+		new AssetsPlugin({filename: 'manifest.json', path: outputDir})
+	],
+	module: {
+		rules: [
+			{
+				enforce: 'pre',
+				test: /\.(gif|png|jpe?g|svg)$/i,
+				loader: 'image-webpack-loader'
+			},
+			{
+				test: /\.(gif|png|jpe?g|svg)$/i,
+				loader: 'file-loader?name=[name].optimized.[ext]'
+			},
+		],
+	}
+};