https://coding.imooc.com/class/171.html

请问解决了吗？我也遇到同样的报错

limit: 20000 这个数值是用来做限制的，你这个20000  太大了，基本上都没什么图片会有这么大的，所以不做base64解析（ 1 = 1024字节 ）

不需要自己写，只要配置 PostCss 和 autoprefixer 就可以自动去添加前缀

https://blog.csdn.net/jiangjunyuan168/article/details/124283830

自定义的,跟.vue.ts.coff都是同理的，都是读取文件片段后处理

https://www.npmjs.com/package/image-webpack-loader

options: {        
bypassOnDebug: true, // webpack@1.x        
disable: true, // webpack@2.x and newer      
},

disable:true

应该是图片的原因吧，找一个大点的图。我的是880K的图，全屏背景图，压缩后，73K，画质基本没太大变化

如果你这里加了这段，注释掉看看，起初加这段是因为防止和htmlwebpackplugin产生title属性的冲突，现在看来应该是include限定了范围导致模板文件index.html无法被html-loader解析到，其中的图片自然就无法被打包

已解决

应该是webp的问题，我去掉之后打包就好了

ESLint是一个Javascript静态检查工具，它可以帮你养成良好的编程习惯，使你的javascript代码达到国际化的水准。ESLint是所有Javascrpt静态检查工具里最晚诞生的一个，之前还曾经有过JSLint以及JSHint等工具，但JSLint和JSHint都是用的一套标准，在目前这个前端技术飞速发展的时代已经显得有点落伍。ESLint的好处是既提供了国际大厂的标准，同时又给了你自定义标准的可能性。ESLint的推荐设置方式是按项目设置，但是如果我们有很多个不同的javascript项目的话，一个一个去设置未免太麻烦，所以在这里介绍的是全局设置方法，一次设置，所有项目全部采用同一标准。

首先，在atom中安装linter插件和linter-eslint插件。安装完成之后，linter-eslint的缺省设置有2个地方需要修改：

把Disable when no ESLint config is found的对钩去掉。这个选项的意思是说：如果你的javascript项目文件夹中没有.eslintrc这样的配置文件的话，那么ESLint就不起作用。在这里，我们要设置为全局lint，不需要在每个javascript文件夹中包含.eslintrc文件，所以要把它去掉，否则由于我们的项目文件夹中没有.eslintrc文件，ESLint会不起作用。

把Use global ESLint installation的对钩勾上。因为我们使用的是全局的ESLint安装包

limit的值需要根据你引入图片的大小来设定，我的图片时44.5，我设置为20000是没有任何效果也没有报错，所以我修改为50000就能正常转为base64的图片了

好不容易看完才知道只有一半

你需要使用到html-loader 或者用require

用命令sass 加文件名就，要统一的话走一下file文件一个一个来吧

是的，减少了http请求，一个http请求就是一个网络开销

解决了，此问终结

又错了 ${ }

在url-loader的options中设置publicPath:

你这个是路径问题啊,你看看Cant't resolve之后的跟你的文件路径比对一下吧

我也想知道

快了(⊙o⊙)？

用 cnpm 安装 image-webpack-loader 后可以。。

日志文件吧，应该对你项目本身没什么影响

要，而且官方也不推荐使用全局安装的webpack。你全局安装最新版，但是假如实际工作中要维护一个项目是旧版webpack打包的配置文件写好了，也是旧版的语法，你用新版的webpack打包不就报错了吗？（可以在对应项目安装指定版本的webpack）

老师还没录制