Failed to load resource: the server responded with a status of 404 (Not Found)
问题描述:
在nextjs
项目里想要引入图片,地址都是对的,但是最后报404错误
1、在项目根目录添加一个static
文件夹,在static中创建一个images
文件夹,将图片放在images文件夹中。
2、引入方式
3、安装url-loader
yarn add url-loader
4、在next.config.js
文件写入相应配置
module.exports = {
webpack: (config) => {
config.module.rules.push({
test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
loader: require.resolve("url-loader"),
options: {
limit: 10000,
name: "static/media/[name].[hash:8].[ext]",
},
});
return config;
}
}
❤运行项目,图片引入成功!开森~❤