webpack 图像加载器出错

Posted

技术标签:

【中文标题】webpack 图像加载器出错【英文标题】:Error with webpack image loader 【发布时间】:2017-12-06 06:59:55 【问题描述】:

我的 webpack 配置是 -


test: /\.(jpe?g|png|gif|svg|woff2?|ttf|eot)$/i,
loaders: ['file-loader?hash=sha512&digest=hex&name=content/[hash].[ext]']
, 

得到以下错误:

ERROR in ./~/css-loader!./~/postcss-loader!./~/sass-
loader/lib/loader.js!./src/main/webapp/content/scss/vendor.scss
Module not found: Error: Can't resolve './images/color.png' in 
'D:\Work\Personal\Projects\CashbackCalculator\src\main\webapp\content\scss'
@ ./~/css-loader!./~/postcss-loader!./~/sass-
loader/lib/loader.js!./src/main/webapp/content/scss/vendor.scss 6:284192-
284221
@ ./src/main/webapp/content/scss/vendor.scss
@ ./src/main/webapp/app/vendor.ts
@ dll vendor

【问题讨论】:

在您的配置文件中设置路径可能存在一些问题。愿意展示您的配置文件吗? 【参考方案1】:

如果您有包含所有图像的imagesfolder,那么您可以尝试按照如下所示的代码加载图像:

test: /\.(jpe?g|png|gif|svg|woff2?|ttf|eot)$/i,
use: [
          loader: "url-loader?name=/images/[name].[ext]" ,
          loader: "image-webpack-loader" 
     ]

它对我有用!

【讨论】:

以上是关于webpack 图像加载器出错的主要内容,如果未能解决你的问题,请参考以下文章

在 webpack.config.js 中包含加载器时出错

webpack 出错 - 您可能需要适当的加载器来处理此文件类型

Webpack 文件加载器忽略 PNG 文件

Webpack 的文件加载器在生产过程中不会将图像从 /src 复制到 /dist

React + Webpack 不解析文件加载器

Webpack:无法解析模块“文件加载器”