小编Chr*_*Jol的帖子

有没有一种方法可以将各种 SCSS 和 SASS 文件一起编译成一个 SCSS 捆绑文件?

我目前正在构建一个 npm 组件库,并使用汇总捆绑过程来编译该库以进行分发。该项目的CSS是使用SCSS编写的,但它也依赖于Bulma ,这是一个用SASS编写的CSS框架。

我希望能够将 bulma 源代码与我的自定义 scss 全部捆绑到一个 scss 文件中,然后我可以在其他项目中使用该文件。这样我仍然可以从这些项目中 scss 提供的功能中受益,例如变量和 mixin。

我希望在构建过程中实现自动化,这样我在开发新组件时就不必担心它。我查看了许多用于捆绑 scss 文件的 npm 包,但没有一个包同时支持SASSSCSS。我也尝试过将我的项目完全转换为 sass,但总体上似乎没有对 sass 捆绑提供任何良好的支持。

例如,我可能有一个 main.scss 文件,如下所示:

@import "~bulma/bulma.sass";
@import "./utils/variables.scss";
Run Code Online (Sandbox Code Playgroud)

它将 sass 和 scss 文件一起导入。这是 sass 编译器支持的东西我可以将其编译为捆绑的 css 文件,没有任何问题。但似乎不支持捆绑到一个 scss 文件中。

我一直尝试使用的两个主要 NPM 包是:

scss 捆绑捆绑 scss

scss-bundle很棒,但它似乎没有 SASS 支持,所以这对 Bulma 来说是不行的。

至于bundle-scss,我将项目转换为使用SASS并相应地配置了包,使用的配置如下:

{
  "dest": "dist/bundle.sass",
  "mask": ["src/styles/**/*.sass", "node_modules/bulma/**/*.sass"]
}

Run Code Online (Sandbox Code Playgroud)

据我所知,这应该遍历样式文件夹和 Bulma 依赖项文件夹的所有子目录中的所有文件,并将它们一起编译成一个bundle.sass文件。尽管我更喜欢来自 …

rollup sass npm bulma

5
推荐指数
0
解决办法
1176
查看次数

标签 统计

bulma ×1

npm ×1

rollup ×1

sass ×1