我正在尝试通过webpack编译我的Sass。编译正常的sass是好的，但我得到了一个错误。
Module not found: Error: Can't resolve '../img/twitter.svg' in '/Users/Steve/mywebsite/scss'
@ ./~/css-loader!./~/sass-loader/lib/loader.js!./scss/main.scss 6:94501-94530有没有办法解决这个问题？或者，有没有一种方法可以将sass编译器的级别设置得不那么严格，从而忽略某些错误
下面是我目前的配置。
const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
resolve: {
alias: {
masonry: "masonry-layout",
isotope: "isotope-layout",
},
},
entry: "./main.js",
output: {
path: path.resolve(__dirname, "./dist/dist2"),
filename: "bundle.js",
},
module: {
rules: [
{
test: /\.(png|jpg|svg)$/,
include: path.join(__dirname, "/dist/img"),
loader: "url-loader?limit=30000&name=images/[name].[ext]",
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: "babel-loader?presets[]=es2015",
},
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
use: ["css-loader", "sass-loader"],
}),
},
{
test: /\.vue$/,
loader: "vue-loader",
options: {
loaders: {},
// other vue-loader options go here
},
},
],
},
plugins: [
// new webpack.optimize.UglifyJsPlugin(),
new ExtractTextPlugin("ross.css"),
],
};
6条答案
按热度按时间uurity8g1#
我知道这是晚了，但对于任何人寻找一个变通办法这个错误;在我的例子中，图像在模板中加载得很好，然而，Webpack返回了一个错误：
Module not found: Error: Can't resolve './path/to/assets.png'修复/解决方法：
将
?url=false添加到css-loader中，这将禁用css-loader的URL处理：oxcyiej72#
我没有任何运气与
url-loader和file-loader建议在另一个答案。我可以用resolve-url-loader解决它kuarbcqp3#
这是css-loader 4中的一个突破性变化。x（根据css-loader issue 1136）。
ukqbszuj4#
您尚未为webpack文件中的图像指定任何加载器。
1.将
url-loader和file-loader安装到您的包中。json经由
1.在webpack配置文件中添加以下内容-
yk9xbfzb5#
我使用这个“Disable url resolving using the /* webpackIgnore：true */ comment”
www.example. com
fcwjkofz6#
2023 - webpack（5.81.0）
我得到了同样的错误，使用webpack（5.81.0）与CSS。在尝试了以上所有的答案都没有成功之后，我研究了一点，对这个问题有了更好的理解。
这个错误通常发生在你使用css文件中的图片时，比如
background-image:url(path/to/image)。在我的例子中，我使用的是tailwind的
bg-[url(path/to/image.jpg)]类，但是url相对于构建过程中的加载位置是错误的。所以，最好的思考方式是：在构建过程中将在何处使用映像？相应地改变图像URL。