css - 将 CSS 添加到 webpack 构建

Question

我有一个相当简单的 webpack 元素 - 使用 Webpack 指南构建。参见 https://github.com/timburgess/webpack-postcss-tailwind

在 src 目录中有一个 style.css，但在构建时没有将 .css 添加到 /dist 目录。

进一步阅读，任何 css 都应作为内联样式添加，但这种情况并未发生。

通过 https://github.com/webpack-contrib/mini-css-extract-plugin 解决根据理查兹的回答。

Answer 1

Webpack 将打包通过 import 引用的 css 文件将源 javascript 文件中的语句放入输出 javascript 文件 (bundle.js)。您将看到在运行时通过内联将类应用于 webapp <style>动态应用于 html 的标签。

许多开发人员认为这种行为不合适，会使用特殊插件让 webpack 生成单独的 bundle .css然后使用传统(和缓存友好)<link rel="stylesheet" type="text/css" href="bundle.css"> 在 html 中引用的文件标签。见:

https://github.com/webpack-contrib/mini-css-extract-plugin