Webpack+Vue,打包图片时出现src为“[object Module]”

今天尝试了一下用webpack+vue写项目,用webpack作为打包工具,之前是直接使用Vue-cli,使用了webpack才知道多恶心,有时候还要考虑到版本的问题,我是吐了,希望和我遇到同样问题的人,能对你有帮助。


snipaste_20200522_221317.png

当时以及配置了file-loader的,也尝试了url-loader,怎么弄都是出不来,后面发现
如果使用"file-loader": "^4.2.0"或者"file-loader": "^2.0.0"却可以正常打包。


snipaste_20200522_221611.png

这个就是原因,file-loader在新版本中esModule默认为true,因此手动设置为false,
就可以正常显示出来了。
{
                test: /\.(png|jpg|gif|svg|jpeg)$/,
                // loader: 'file-loader',
                loader: 'url-loader',
                options: {
                    esModule: false,
                    name: '[name].[ext]',
                    outputPath:"image/",
                    limit: 10240
                    // publicPath: '../../assets/image'
                }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。