file-loaderでcssのbackground-imageを表示させる

hakozaru · Oct 11, 2021 · 5e9b733 · 5e9b733
1 parent c5d7b0b
commit 5e9b733
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/package.json b/package.json
@@ -16,6 +16,7 @@
     "@types/react-dom": "^17.0.9",
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "css-loader": "^6.3.0",
+    "file-loader": "^6.2.0",
     "sass": "^1.42.1",
     "sass-loader": "^12.1.0",
     "style-loader": "^3.3.0",

diff --git a/webpack.config.js b/webpack.config.js
@@ -37,7 +37,16 @@ module.exports = {
       },
       {
         test: /\.(png)$/,
-        type: "asset/resource"
+        use: [
+          {
+            loader: 'file-loader',
+            options: {
+              name: './images/[name].[ext]'
+            }
+          }
+        ],
+        type: 'javascript/auto',
+        dependency: { not: ['url'] }
       },
       {
         test: /\.(svg)$/,

diff --git a/yarn.lock b/yarn.lock