使用MinicsSextractPlugin时,可以将CSS作为字符串导入

发布于 2025-01-28 02:27:28 字数 616 浏览 5 评论 0原文

我正在使用webpack。我需要将CSS文件作为字符串加载,并且可以使用CSS-Loader进行,但是我还需要使用MinicsSextrackPlugin将CSS直接注入DOM。但是,如果我使用MinicsSextractPlugin,当我尝试导入CSS时,我会收到一个空对象。

import bootstrapStyle from 'bootstrap/dist/css/bootstrap.css';

console.log(bootStrapStyle); // empty object

Webpack配置

module: {
            rules: [{
                test: /\.css$/,
                use: [{
                    loader: MiniCssExtractPlugin.loader,
                }, {
                    loader: 'css-loader',
                }],
            },

有没有办法实现两者?

我需要CSS作为字符串,以便将其注入Web组件。

I'm using webpack. I need to load a css file as a string and I'm able to do so with css-loader, but I also need to use MiniCssExtractPlugin to inject css directly into the DOM. If I use MiniCssExtractPlugin, though, when I try to import a css I receive an empty object.

import bootstrapStyle from 'bootstrap/dist/css/bootstrap.css';

console.log(bootStrapStyle); // empty object

webpack config

module: {
            rules: [{
                test: /\.css$/,
                use: [{
                    loader: MiniCssExtractPlugin.loader,
                }, {
                    loader: 'css-loader',
                }],
            },

Is there a way to achieve both?

I need the css as a string in order to inject it into a web component.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文