不同SASS/CoffeeScript的基础上构建

我试图为前端框架，将在SASS（以及可能的CoffeeScript）的基础上我在哪里部署创建不同的路径创建构建系统变量值。例如，我可能在我的本地SASS中引用了一个映像文件../images/image.png，这在我的本地环境中工作正常。但是，我的客户有一个非常锁定的环境，必须以不同的方式完成（从CDN获取其图像）。所以他们的图像路径可能看起来像~Some_service_call/images/image.png。不同SASS/CoffeeScript的基础上构建

我希望能做的是为两种环境准备好某种配置，所以当我在本地开发时，我可以通过终端运行一个命令，如build local package或build deploy package，它可以自动识别我部署的环境并使用基于此的路径。我最好有一个单独的配置JSON文件，该文件控制为每个SASS/Coffeescript变量使用哪些路径。

到目前为止，我已经开始考虑咕噜了这一点，但不知道它的正确的解决方案。有没有人曾经尝试过这种类型的东西，有什么工作/不适合你？

来源

2013-04-04 David Savage

使用指南针编译您的项目。

在罗盘的config.rb定义自定义功能：

# Assign a name to the project and pass it into SASS 
$environment = "development" 
module Sass::Script::Functions 
    def environment 
    Sass::Script::String.new($environment) 
    end 
end

此功能将在上海社会科学院可用：

$images-root: ".." 
@if environment() == production 
    $images-root: "/var/www/static/images" 

html 
    background-image: url(#{$images-root + "/sexy-lady.png"})

而且你可以自定义你的内衬！例如，您可以将路径传递给SASS。或者你可以用一些高级逻辑（服务调用，读取JSON）创建一个单独的Ruby文件，从config.rb中请求它并传递给SASS函数。

最后，你写一个小的脚本，更新的信息和运行compass compile。

PS指南针也允许添加的发展和CSS压缩生产调试信息。

来源

2013-04-04 21:39:20

这似乎是SASS的一个很好的方法。你知道在编译过程中是否有类似于CoffeeScript的方法吗？如果它有帮助，我使用Codekit来编译，但我不知道它为此提供的任何功能。 – 2013-04-16 16:51:16

对不起，我不使用CoffeScript（还）。 PS不要忘记接受答案。对于CoffeeScript，更好地提出一个单独的问题。 – 2013-04-16 20:50:00

如果你不希望创建一个config.rb，只需使用选项环境在gruntfile.js并将其设置为生产或发展：

compass: {   
      prod: { 
       options: {     
        environment: 'production' 
       } 
      }, 
      dev: { 
       options: { 
        environment: 'development' 
       } 
      } 
     }

和环境值将可在file.scss或file.sass文件：

$font-path: "../fonts"; 

@if compass-env() == 'production' 
{ 
    $font-path: "../assets/fonts" 
}

来源

2015-09-10 23:05:57

不同SASS/CoffeeScript的基础上构建

回答

相关问题