html-webpack-plugin 是如何将js跟art关联的

同学你好， 因为老师在后续讲解中使用swiper库重新实现slider部分，所以老师源码为例给同学分析js和art是如何关联起来的， 具体可以参考如下解析：

pages/index/compontents下的slider组件的文件夹目录结构如下：

在pages/index/components/slider/index.js文件中引入了slider.css和config.js

然后在pages/index/index.js中引入index/components/slider/index.js文件

在pages/index/index.art中引入index/components/slider/slider.art文件

在webpack.config.js中先配置了入口文件为pages/index/index.js，由于默认会加载index.js文件，所以下面截图中省略了index.js

同时配置了html-webpack-plugin插件信息， 将art文件编译为对应的html文件，如下图所示：

而html-webpack-pluging编译时会根据写的代码，在每次运行后生成对应的模板文件，并自动将依赖的css或js文件添加到模板文件中，也就将js文件和art文件关联起来了。

祝学习愉快~