css - 有没有办法用webpack动态加载css文件

Question

Webpack 有一个代码拆分功能（使用 require.ensure 或 System.import），它使我们能够动态加载我们的 js 文件。但我想知道是否有任何方法可以动态加载 css 文件？

这很奇怪，因为我只在一次加载我的 css 文件时动态加载我的 js 文件。

在我的项目中，我将我的 css 文件放在单独的条目中，并使用 extractTextPlugin 将它们编译为额外的 css 文件。并将它们加载到链接标签中。

Answer 1

你可以，但它们不会被加载为 CSS 文件（使用 ExtractTextPlugin），而是从 JS 中加载，并注入 style-loader（这完全没问题）。

只有几件事要做。确保正确设置 CSS/SASS/LESS/...-loaders。如果 ExtractTextPlugin 已经可以工作，那你就很好了。然后还要确保您已在加载程序中fallbackLoader设置为style-loader（并allChunks设置为默认值：）。falseExtractTextPlugin.extract({})

此时，只需使用require.ensure或System.import要求/导入您的 CSS 文件，就像使用代码一样。多亏了 webpack 的魔力，一切都会神奇地工作！

Answer 2

我成功地使用以下设置为不同的租户动态加载样式。

https://github.com/shiranGinige/react-redux-starter-with-login/blob/master/README.md