webpack 如何禁用外部类的sass警告

e5nqia27 于 2022-11-13 发布在 Webpack

关注(0)|答案(1)|浏览(365)

我有一个react项目，因为我已经看到node-sass被弃用了，所以我尝试用Dart sass更新它。
问题是，当我想构建我的应用程序时，我会收到很多来自我无法控制的文件的警告。
所以，当我运行npm run build时，它实际上被配置为run "build": "react-scripts build"到我的package.json中。
然后在我的webpack.config中，在模块，规则部分下，我有：

{
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    {
                        loader: 'sass',
                        options: {
                            sourceMap: true
                        }
                    }
                ]
            },

这会产生许多Deprecation警告，但以下是警告的堆栈追踪：

node_modules/bootstrap/scss/vendor/_rfs.scss 49:24  @import
node_modules/bootstrap/scss/_mixins.scss 6:9        @import
src/_metronic/_assets/sass/_init.scss 37:9          @import
stdin 8:9                                           root stylesheet

正如您所看到的，这是指向我的node_module项目中的文件。实际上，如果我转到src/_metronic/_assets/sass/_init.scss，导致问题的行是：

@import "~bootstrap/scss/mixins";

由于我们使用模板来避免设计问题和质疑，我真的很想保持.scss文件不变。
我尝试了quietDeps选项，并在node_modules文件夹中添加了一个exclude键，但它不起作用。
你知道怎么做吗？
谢谢

webpack

来源：https://stackoverflow.com/questions/73770608/how-can-i-disable-sass-warning-for-external-classes

1条答案

按热度按时间

2ul0zpep1#

在Dart Sass中使用@import是deprecated，将在未来几年内删除。
使用@use加载引导混合：

@use "bootstrap/scss/mixins" as bs-mixins;

.img-fluid {
  @include bs-mixins.img-fluid();
}

测试对象：Webpack 5.74.0，sass 1.54.9，sass加载程序13.0.2。无警告。

赞(0）回复(0）举报 2022-11-13

我来回答

webpack 如何禁用外部类的sass警告

1条答案

相关问题

热门标签

最新问答