webpack 中如何自动加载依赖的 CSS 和分离的 JS

Question

在使用 html-webpack-plugin 的情况下，可以通过生成 HTML 自动加载依赖的 CSS 和分离的 JS，如果不用 HTML，以脚本注入的方式，如何让这些依赖文件自动加载？

Answer 1

现在我使用的是 assets-webpack-plugin

Answer 2

你可以通过分析 compilation 实例得到资源的依赖关系，html-webpack-plugin 源码里面也是这么做的。

我自己搞的一个项目，服务端渲染渲染html，图片媒体资源放文件服务器上，webpack 用来构建css和js。

1. 在 Webpack 每次编译完成后生成一个资源对应关系文件 webpack-build-data.json:
   
2. 服务端读取插入 html 中即可。
3. 实际项目中比这个复杂，要区分生产环境和开发环境。
4. 这一套下来少不了 nginx 容器的协调工作，主要是反向代理。