如何从bulma

Question

我正在尝试使用bulma框架，但我只需要网格部分，遗憾的是它全部都是sass而且我不知道如何只获得css部分。

repo在这里https://github.com/jgthms/bulma/tree/master/sass/grid，我假设网格名为columns.sass

如果我通过npm下载bulma

npm install bulma

我已经安装了/ sass。如何才能在css中获取网格部分？

Answer 1

您可以使用node-sass来构建您所指的列（网格）的CSS版本。

使用npm下载bulma包。然后创建一个单独的文件，用于导入mixins.sass和column.sass文件。最后，运行node-sass以获得闪亮的新CSS文件。

<强> grid.sass

@import "utilities/mixins.sass"
@import "grid/columns.sass"

<强>命令行

node-sass grid.sass grid.css

Answer 2

bulma > 0.4的更新答案， 您还需要导入variables.sass

 @import "utilities/variables.sass"
 @import "utilities/mixins.sass"
 @import "grid/columns.sass"

Answer 3

从版本 0.7.1 开始，只编译Grid Column系统的方法如下：

先决条件：您需要安装node-sass：npm install -g node-sass

1. 下载或git clone回购

   git clone git@github.com:jgthms/bulma.git
   cd bulma
   

2. 创建文件grid.sass并添加以下行：

   @import "sass/utilities/_all"
   @import "sass/grid/columns"
   

3. 编译

   node-sass grid.sass grid.css