0

我已经像这样导入了 boostra5 scss https://www.npmjs.com/package/bootstrap

// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import '../../node_modules/bootstrap/scss/functions' ;

// 2. Include any default variable overrides here

// 3. Include remainder of required Bootstrap stylesheets
@import '../../node_modules/bootstrap/scss/variables' ;
@import '../../node_modules/bootstrap/scss/mixins';

// 4. Include any optional Bootstrap components as you like
@import '../../node_modules/bootstrap/scss/containers' ;
@import '../../node_modules/bootstrap/scss/grid' ;

// 5. Optional for bootstrap
@import '../../node_modules/bootstrap/scss/accordion' ;
@import '../../node_modules/bootstrap/scss/modal' ;

一切都很好,它编译。我正在使用 dart sass 版本并想使用 @use 而不是 @import。

因此,根据文档,我使用 @use 关键字并在最后使用“as *”省略命名空间。

// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@use '../../node_modules/bootstrap/scss/functions' as *;

// 2. Include any default variable overrides here

// 3. Include remainder of required Bootstrap stylesheets
@use '../../node_modules/bootstrap/scss/variables' as *;
@use '../../node_modules/bootstrap/scss/mixins'as *;

// 4. Include any optional Bootstrap components as you like
@use '../../node_modules/bootstrap/scss/containers' as *;
@use '../../node_modules/bootstrap/scss/grid' as *;

// 5. Optional for bootstrap
@use '../../node_modules/bootstrap/scss/accordion' as *;
@use '../../node_modules/bootstrap/scss/modal' as *;

但是我有一个错误说@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");这意味着样式表没有正确导入。

您知道在这种情况下如何使用 @use 而不是 @import 吗?谢谢!

4

0 回答 0