课件和源代码下载地址

html-webpack-externals-plugin 两年没更新了，有bug，比如多页面时，或导致html中重复引入 <script> 标签，而且看视频中老师编译之前，不仅在 webpack 配置中指定一遍地址，还需要在 html 模板中再写以便。 在该插件的github issues 上，按图索骥，找到了替代方案，朋友们可以试试看，只需要使用 html-webpack-tags-plugin 这个插件（https://github.com/jharris4/html-webpack-tags-plugin），在webpack配置中，HtmlWebpackPlugins 的后面增加如下配置，会和 html-webpack-externals-plugin 插件干的事情类似，插入脚本标签到 html 中，同时自动为 webpack 增加 externals 属性 （文档中有一句：Will add the following properties to the webpack.compilation.options.externals），这个webpack 的 externals 字段就是用来将一些三方 vendors 库从输出文件中去除，我们没有手动配置，是因为了这两个插件背地里自动去做了。 经过上面的讲解，下面该插件为什么这么使用，大概就能明白了吧，具体可以自行查看文档。 ```js new HtmlWebpackTagsPlugin({ scripts: [ { path: 'https://11.url.cn/now/lib/16.2.0/react.min.js', external: { packageName: 'react', variableName: 'React' } }, { path: 'https://11.url.cn/now/lib/16.2.0/react-dom.min.js', external: { packageName: 'react-dom', variableName: 'ReactDOM' } } ] }), ``` 现在尝试注释以上的配置，会发现 react 和 react-dom 两个包，又被打包进 index.js 或 search.js 代码中了，说明它们确实做了两件事： 1. 注入 script 标签 2. 在 webpack 编译过程中指定 externals 字段 https://github.com/jharris4/html-webpack-tags-plugin

css或者less的loader，在dev和prod的时候是不一样的。一个用style-loader，一个用MiniCssExtractPlugin.loader。在视频中没有做区分。

dev开发环境的mode忘改了🤣🤣

webpack.ssr.js中，css 和 less 不解析，为什么？ 之前的SSR课程中，服务端打包为了让样式生效，使用的打包后的 dist/search.html 作为模板，那也是因为 css 已经被解析内联到 html 中才可以哇。 另外，就算是css不做处理，那是如何使用的？ 还有，less 不做处理，又是如何被解析使用的？

我记得之前有一些插件是一个HTML文件就得用一个实例的，所以我写到多页面打包那里去了，如果不同模式下需要对HTML使用的插件不同，该怎么办呢？多页面打包是写到基础配置的啊

老师，您所有的rules的test的正则参数，都应该对点进行转译一下吧。比如/.js$/,应该是是/\.js$/

好像都没配置output