Question

我正在使用jekyll作为设计系统的平台。同时，我有一个目录，我可以在其中共享原型并使用设计系统框架SASS文件在自己的目录中进行工作。

因此，我要做的是在用于原型的目录中编译.scss文件，生成app.scss，然后从设计系统中导入.scss文件。

到目前为止，我发现在文件的开头放置三重破折号就可以执行它，就像在_sass文件中一样，但是似乎没有将.scss导入到文件中。 _sass目录进入项目目录。

到目前为止，这是我理想中想要的目录结构，但是不起作用：

jekyll-project/
├── _includes/
├── _layouts/
├── _site/
├── _sass/
|   └── design-system.scss
|       ├──Components
|          └── component_1.scss
|          └── component_2.scss
|          └── ...
└── css/
│   └── main.scss // this is what gets compiles from the _sass directory
├── projects/
    └── project_1
        └── scss
            └── app.scss // here this file will compile it's own styles to CSS + import the design-system.scss from the _sass directory in:
        └── css
            └── app.css
    └── project_2
        └── scss
            └── app.scss
        └── css
            └── app.css
    └── project_3
        └── ...
├── _config.yml
└── index.html

在project_1文件夹中的scss文件中-还有其他文件-我想在app.scss文件中编译的内容：

1st: the compiled design-system.scss
+
2nd: the styles writen in app.scss

在此先感谢您，并希望能够说明这个问题可以理解。

Answer 1

我设法通过运行以下命令来解决此问题：

直接在sass --watch scss:css目录中的项目文件夹scss和app.scss @import design-system中的

_sass中。例如，我正在调用设计系统文件：

@import "../../../_sass/design-system/design-system.scss";是进行编译的是Sass手表，而不是Jekyll使用的引擎，这是我最初尝试使用的引擎。

可能不是最优雅的解决方案，但解决了我遇到的问题。

使用设计系统作为源代码在其各自的项目目录中编译sass文件

1 个答案: