Skip to content

Instantly share code, notes, and snippets.

@neekey
Last active December 17, 2015 19:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save neekey/5660762 to your computer and use it in GitHub Desktop.
Save neekey/5660762 to your computer and use it in GitHub Desktop.
SASS HTTP Import

由于SASS语言本身的强大和灵活,使用SASS可以构建出非常丰富的组件。我自己再平时的项目中会封装很多组件,通过mixin的方式来调用。然后组件多了思考着如何能共享这些样式模块了。

通过文件复制的方式自然是最土鳖但是最直接的方案之一,但是通过查阅SASS文档,可以看到其本身是支持很多拓展的。因此我们可以通过拓展importer来实现远程导入:

SASS中关于CUSTOM-IMPORTERS的描述:

but importers could be added to load from a database, over HTTP, or use a different file naming scheme than what Sass expects.

由于我不会Ruby,所以无法自己编写扩展。好在有网友已经实现了一个简单的(实际情况是做这块尝试的人还真的是很少)gem模块 remote-sass.

下面直接介绍下如何使用这个模块(直接用全局gem的方式我这边还没弄清楚该怎么用,之后弄清楚了再分享出来):

首先将这个模块的lib复制到你的compass目录下,然后在你的compass配置文件compass.rb中引入该模块:

# Require any additional compass plugins here.
require 'lib/remote-sass'
RemoteSass.location = "http://localhost:8080/"

其中RemoteSass.location是你需要远程引入的http地址的前缀,同时也作为load-path加入到SASS中。如你@import "remote/button"这样的模块,在本地都找不到后,会去请求http://localhost:8080/remote/button.

想要模块正常跑起来,你还可能需要修改remote-sass.rb中上方的require为:

require "lib/remote-sass/version"
require "lib/remote-sass/importer"

OK,这样就OK了,剩下的,你只需要搭建你自己的SASS文件服务就可以了。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment