refactor: remove file-loader and url-loader deps

webpack · Jul 30, 2023 · ed2c619 · ed2c619
1 parent a237895
commit ed2c619
Show file tree

Hide file tree

Showing 7 changed files with 49 additions and 135 deletions.
diff --git a/examples/default/webpack.config.js b/examples/default/webpack.config.js
@@ -1,27 +1,16 @@
 "use strict";
 
-const { version } = require("webpack");
 // our setup function adds behind-the-scenes bits to the config that all of our
 // examples need
 const { setup } = require("../util");
 
-let moduleRuleForPNG = {};
-
-if (version.startsWith("5")) {
-  moduleRuleForPNG = {
-    test: /\.png$/,
-    type: "asset/resource",
-    generator: {
-      filename: "images/[hash][ext][query]",
-    },
-  };
-} else {
-  moduleRuleForPNG = {
-    test: /\.png$/,
-    loader: "file-loader",
-    options: { prefix: "img/" },
-  };
-}
+const moduleRuleForPNG = {
+  test: /\.png$/,
+  type: "asset/resource",
+  generator: {
+    filename: "images/[hash][ext][query]",
+  },
+};
 
 module.exports = setup({
   context: __dirname,

diff --git a/examples/general/config-array/webpack.config.js b/examples/general/config-array/webpack.config.js
@@ -1,29 +1,16 @@
 "use strict";
 
-const { version } = require("webpack");
 // our setup function adds behind-the-scenes bits to the config that all of our
 // examples need
 const { setup } = require("../../util");
 
-const isWebpack5 = version.startsWith("5");
-
-let moduleRuleForPNG = {};
-
-if (isWebpack5) {
-  moduleRuleForPNG = {
-    test: /\.png$/,
-    type: "asset/resource",
-    generator: {
-      filename: "images/[hash][ext][query]",
-    },
-  };
-} else {
-  moduleRuleForPNG = {
-    test: /\.png$/,
-    loader: "file-loader",
-    options: { prefix: "img/" },
-  };
-}
+const moduleRuleForPNG = {
+  test: /\.png$/,
+  type: "asset/resource",
+  generator: {
+    filename: "images/[hash][ext][query]",
+  },
+};
 
 module.exports = [
   setup({
@@ -53,19 +40,13 @@ module.exports = [
           test: /\.less$/,
           use: ["style-loader", "css-loader", "less-loader"],
         },
-        isWebpack5
-          ? {
-              test: /\.png$/,
-              type: "asset/resource",
-              generator: {
-                filename: "images/[hash][ext][query]",
-              },
-            }
-          : {
-              test: /\.png$/,
-              loader: "url-loader",
-              options: { limit: 100000 },
-            },
+        {
+          test: /\.png$/,
+          type: "asset/resource",
+          generator: {
+            filename: "images/[hash][ext][query]",
+          },
+        },
       ],
     },
     optimization: {

diff --git a/package.json b/package.json
@@ -103,7 +103,6 @@
     "eslint-config-webpack": "^1.2.5",
     "eslint-plugin-import": "^2.23.2",
     "execa": "^5.1.1",
-    "file-loader": "^6.2.0",
     "html-webpack-plugin": "^5.5.3",
     "http-proxy": "^1.18.1",
     "jest": "^29.5.0",

diff --git a/test/fixtures/historyapifallback-3-config/webpack.config.js b/test/fixtures/historyapifallback-3-config/webpack.config.js
@@ -1,24 +1,12 @@
 "use strict";
 
-const { version } = require("webpack");
-
-let moduleRuleForHTML = {};
-
-if (version.startsWith("5")) {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    type: "asset/resource",
-    generator: {
-      filename: "index.html",
-    },
-  };
-} else {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    loader: "file-loader",
-    options: { name: "index.html" },
-  };
-}
+const moduleRuleForHTML = {
+  test: /\.html$/,
+  type: "asset/resource",
+  generator: {
+    filename: "index.html",
+  },
+};
 
 module.exports = {
   mode: "development",

diff --git a/test/fixtures/historyapifallback-config/webpack.config.js b/test/fixtures/historyapifallback-config/webpack.config.js
@@ -1,24 +1,12 @@
 "use strict";
 
-const { version } = require("webpack");
-
-let moduleRuleForHTML = {};
-
-if (version.startsWith("5")) {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    type: "asset/resource",
-    generator: {
-      filename: "[name][ext]",
-    },
-  };
-} else {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    loader: "file-loader",
-    options: { name: "[name].[ext]" },
-  };
-}
+const moduleRuleForHTML = {
+  test: /\.html$/,
+  type: "asset/resource",
+  generator: {
+    filename: "[name][ext]",
+  },
+};
 
 module.exports = {
   mode: "development",

diff --git a/test/fixtures/mime-types-config/webpack.config.js b/test/fixtures/mime-types-config/webpack.config.js
@@ -1,32 +1,12 @@
 "use strict";
 
-const { version } = require("webpack");
-
-let moduleRuleForCustom = {};
-
-if (version.startsWith("5")) {
-  moduleRuleForCustom = {
-    test: /\.custom$/,
-    type: "asset/resource",
-    generator: {
-      filename: "[name][ext]",
-    },
-  };
-} else {
-  moduleRuleForCustom = {
-    test: /\.custom$/,
-    use: [
-      {
-        loader: "file-loader",
-        options: {
-          name() {
-            return "[name].[ext]";
-          },
-        },
-      },
-    ],
-  };
-}
+const moduleRuleForCustom = {
+  test: /\.custom$/,
+  type: "asset/resource",
+  generator: {
+    filename: "[name][ext]",
+  },
+};
 
 module.exports = {
   mode: "development",

diff --git a/test/fixtures/multi-public-path-config/webpack.config.js b/test/fixtures/multi-public-path-config/webpack.config.js
@@ -1,25 +1,14 @@
 "use strict";
 
 const path = require("path");
-const { version } = require("webpack");
 
-let moduleRuleForHTML = {};
-
-if (version.startsWith("5")) {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    type: "asset/resource",
-    generator: {
-      filename: "path/to/file.html",
-    },
-  };
-} else {
-  moduleRuleForHTML = {
-    test: /\.html$/,
-    loader: "file-loader",
-    options: { name: "path/to/file.html" },
-  };
-}
+const moduleRuleForHTML = {
+  test: /\.html$/,
+  type: "asset/resource",
+  generator: {
+    filename: "path/to/file.html",
+  },
+};
 
 module.exports = [
   {