webpack-dev-server不能加载图片?

webpack配置

//webpack.config.js
var path = require('path')
module.exports = {

entry: { login: ['./public/javascripts/login.jsx'] },
output: {
    path: path.join(__dirname, '/public/bundle'),
    publicPath: "/bundle/",
    filename: '[name].js'
},
module: {
    loaders: [
        {
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            loader: 'babel-loader', // 'babel-loader' is also a legal name to reference
        }, {
            test: /\.css$/,
            //loader: "css-loader",
            use: ['style-loader', 'css-loader']
        }, {
            test: /\.(png|jpg)$/,
            loader: 'url-loader?limit=8192'
        }
    ]
},
devServer: {
    port: 3001
}

};
启动webpack-dev-server后,前端react使用<img src="url">的标签报404错误,加载不到图片,但是打包完之后图片是可以加载出来的,这是为什么?大佬们

阅读 7.9k
3 个回答

如果url是后台传过来数据,要用<img :src='url'/>才行吧

会不会是本地图片路径设置的问题。麻烦查看一下,打包前后图片src的路径是否一致。

新手上路,请多包涵

在use后面添加 publicPath: "../" 试试
test: /.css$/,
//loader: "css-loader",
use: ['style-loader', 'css-loader']
publicPath: "../"

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题