关于 SASS 中@import 的使用，有一些疑问

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 3660 天前的主题，其中的信息可能已经有所发展或是发生改变。

各位，最近在用SASS做点前端的小事情，发现了一个很有趣的现象，

比如我有一个项目, 里面的scss分成了好几个部分，
- component-a
├── _a-1.scss
├── _a-2.scss
- component-b
├── _b-1.scss
├── _b-2.scss
- component-c
├── _c-1.scss
├── _c-2.scss

- out1.scss
- out2.scss
- out3.scss

其中 out*.scss 是目标的几个scss文件，而component-*目录下得是零碎的scss文件。我用scss做compile的时候，时间居然到达了30s一个文件，编译这三个out*.scss花了我100秒，然后我就仔细检查了下各个component-*目录下得scss文件。

因为是基于compass还有susy的，几乎每个文件里面都有类似下面的 @import 列表

@import 'compass';
@import 'susyone';
@import 'xx';

我在想，正常情况下，SASS应该是有一个cache,可以记住一个外部的lib是否被import过，然后直接render每个scss文件的，可是这么长时间的编译，难道是因为sass没有做这个cache,每次重新import 文件，从中找出所有的变量？于是我就把各个文件中不需要的@import语句尽量删掉，放在一个额外的专门 import 外部库的scss文件中，于是，我的compile时间变成了总共30s...

觉得很奇怪，请问下各位，大家用sass的时候都是如何组织@import的，在一些零碎的scss中大量使用@import会拖慢整个compile过程吗？

===
考虑到我用的是比较新的版本，这里也专门列一下:
compass => '1.0.0.alpha.19' # 用这么新的版本也属无奈，下面会说一下
susy => '2.1.1'
sass => '3.3.4'

因为想用 susy 2, 所以只能用 sass 3.3, 那么目前兼容的 compass 就只有这个 1.0 alpha 了。。。

scss

import

component

3 条回复 • 1970-01-01 08:00:00 +08:00

jsonline

2014-04-20 15:58:06 +08:00

默认有 cache, 放在貌似叫做 .sass_cache 的目录里，你禁用了么？

in1024days

2014-04-20 15:58:38 +08:00

@jsonline 没有，那个目录一直都在的。。

P233

2014-04-20 23:31:32 +08:00

每个文件都 import "compass" import "susyone" ？只在 out*.scss 中开头引用一次，各个 partials 就不需要二次引用了。

目前只用 Bourbon + Bourbon Neat，
Libsass 编译时间通常不到 1ms