网页中图片地址从html查不到,webpack打包的时候img标签中的src找不到?

我写的路径应该没问题的:

bVFUsX?w=1884&h=1186

运行后报错:

bVFUs3?w=948&h=214

webpack配置:

let webpack = require('webpack'),

path = require('path'),

HtmlWebpackPlugin = require('html-webpack-plugin'),

ExtractTextPlugin = require('extract-text-webpack-plugin'),

hotMiddlewareScript = 'webpack-hot-middleware/client?reload=true',

utils = require('./utils')

var env = process.env.NODE_ENV,

cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap),

cssSourceMapProd = (env === 'production' && config.build.productionSourceMap),

useCssSourceMap = cssSourceMapDev || cssSourceMapProd;

module.exports = {

devtool: 'eval-source-map', //配置生成Source Maps,选择合适的选项

entry: {

desktop: [path.resolve(__dirname, '../src/main.js'), hotMiddlewareScript],

},

output: {

path: path.resolve(__dirname, '../dist'), //打包后的文件存放的地方

publicPath: '/',

filename: '[name].js'

},

resolve: {

extensions: ['', '.js'],

fallback: [path.join(__dirname, '../node_modules')],

alias: {

'src': path.resolve(__dirname, '../src'),

'assets': path.resolve(__dirname, '../src/assets'),

'scss': path.resolve(__dirname, '../src/scss')

}

},

module: { //在配置文件里添加JSON loader

loaders: [{

test: /\.json$/,

loader: "json"

}, {

test: /\.js$/,

exclude: /node_modules/,

loader: 'babel'

}, {

test: /\.css$/,

loader: 'style!css!postcss' //添加对样式表的处理

}, {

test: /\.scss$/,

loader: 'style!css!sass?sourceMap'

}, {

test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,

loader: 'url?limit=10000&name=images/[name].[ext]'

}, {

test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,

loader: 'url?limit=10000&name=images/[name].[ext]'

}]

},

sassLoader: {

includePaths: [path.resolve(__dirname, "./some-folder")]

},

postcss: [

require('autoprefixer') //调用autoprefixer插件

],

plugins: [

new webpack.BannerPlugin("Copyright B1anker."), //在这个数组中new一个就可以了

new webpack.HotModuleReplacementPlugin(),

new HtmlWebpackPlugin({

//渲染输出html文件名,路径相对于 output.path 的值

filename: './index.html',

//渲染源模版文件

template: path.resolve(__dirname, '../src/views/index.html'),

//这个东西非常重要,true: 自动写入依赖文件; false: 不写入依赖,构建多页面非常有用

inject: true

})

],

devServer: {

contentBase: "./dist", //本地服务器所加载的页面所在的目录

colors: true, //终端中输出结果为彩色

historyApiFallback: true, //不跳转

inline: true //实时刷新

}

}

如何处理呢?

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值