Fsz

@lcxfs1991 你好，我最近也遇到一个比较难于处理的问题。 简单来说，在我的项目中，前端需要输出 .pug 模板文件给后端，由后端传入一些变量去动态渲染出html。 并且，前端输出的 .pug 文件需要替换好 webpack 编译输出的 js/css 文件的访问路径，同时保持整个模板文件目录的结构。 这一点我通过在emit事件中读取 .pug 文件，匹配相应的js/css文件，复制加入到assets当中，勉强解决了。 不过还有的问题就是，模板文件实际上并没有经过 webpack 去处理资源的依赖，这就导致了模板文件中存在的图片资源的依赖无法解析并交由 webpack 去内联或者添加 hash 我想请教一下，要出如何编写插件，才能在编译之前将 .pug 文件加入到 webpack 的处理流程中，图片资源的依赖关系，然后在编译之后读取出来？或者说有什么更好的处理方法？

@lcxfs1991 感谢回复，已经解决了。 我发现其实就算是通过 html-webpack-plugin 类似的方式将模板加入 webpack 处理模块中，还是不够的，还需要一个 loader 去触发解析过程，不然的话只会源文件返回。可以试试直接用 html-webpack-plugin 通过模板文件而不添加相应的 loader 就能看得见我说的这个行为。 所以我最终的解决方案是，既然已经要遍历模板文件了，索性直接自己解析，因为实际上要解析的依赖只有 img 的依赖，还是相对单一好解析，只要吧路径解析出来，剩下的其实就是把 url-loader 的代码搬到这里处理一边，该内联的内联，该给hash的给hash。