【问题标题】：Webpack style-loader and css-loaderWebpack 样式加载器和 css-loader
【发布时间】：2018-03-19 09:23:18
【问题描述】：
大家好，我有一个关于 webpack 的愚蠢问题，但我真的很想知道答案
例如，如果我可以将 .css 文件直接插入到我的 index.html 中，那么通过 webpack 使用 css 加载器（css-loader、style-loader）有什么好处呢
我知道 webpack 在大型和可扩展的项目中使用，但是任何人都可以给我一个例子，当它真的有帮助并利用它而不是使用纯粹的、旧的和众所周知的
stylesheet 链接时例如在主文件
index.html
【问题讨论】：
标签：
javascript
webpack
bundler
stylesheet
webpack-style-loader
【解决方案1】：
1- 您可以通过其他插件管道您的 CSS，以根据您需要的浏览器支持自动为您的 CSS 添加前缀。
2- 您可以缩小 CSS。
3- 您可以对 CSS 进行分块并从某些捆绑包中动态排除/包含输出。
4- 您可以生成源映射以便于调试。
5- 当您更改 CSS 时，您可以让浏览器自动重新加载。
6- 您可以使用哈希值动态更改 CSS 输出文件名，以使 CDN 缓存无效。
7- 您可以在 JavaScript 文件中导入 CSS。
8- 您可以在 JavaScript 文件中使用 CSS 模块。
9- 您可以消除未使用的 CSS 规则，也称为死代码消除。
这些只是我想到的一些你可以实现的事情。随着人们继续为生态系统编写插件，还有更多。
应该注意的是，您并不特别需要 Webpack 来实现这些目标，它们可以手动完成，也可以使用任务运行器或自定义脚本来完成。但是如果你的项目使用 Webpack 来打包你的 JavaScript，为什么不让 Webpack 也处理你的 CSS 呢？