0

我们可以在 grunt 构建期间更改 grunt 中的链接，这些链接主要是本地的生产链接吗？

例如

.a-container {
    background: url(../images/hello.jpg) no-repeat top center;
    background-size: 100%;
}

构建后它应该看起来像

.a-container {
    background: url(http://hello.com/blah/blah/hello.jpg) no-repeat top center;
    background-size: 100%;
}

我们有可以在 grunt 文件中配置的 URL。

4

2 回答 2

1

如果您不使用原始 CSS，我建议您将grunt-contrib-compass放在项目之上。您将能够设置开发/生产环境并在需要时运行它们。你会特别想看看images 的选项。我按以下方式构建我的：

compass: {
  dev: {
    sassDir: 'build/sass',
    cssDir: 'stylesheets',
    imagesDir: 'build/assets/images/'
  },
  production: {
    sassDir: 'build/sass',
    cssDir: 'stylesheets',
    imagesDir: 'http://example.com/images'
  },
}

您不必一定要利用 sass/comapss 的其他部分（尽管会有一些前期工作来切换目录和文件结构）。

如果这种方法对您不起作用，您可能需要查看 Yeomans usemin task。不幸的是，我对那个不太熟悉，也无法提供太多帮助。

于 2013-05-01T17:55:13.210 回答
0

为了完成我开始的问题，在这里你可以如何实现它。

        compass: {
              dist: {
               options: {
                 config: 'app/config.rb',
                 sassDir: 'app/styles',
                 cssDir: 'dist/styles',
                 imagesDir: 'app/images/',
                 javascriptsDir: 'app/scripts',
                 fontsDir: 'app/styles/fonts',
                 importPath: 'app/components',
                 outputStyle: 'compressed',
            },
        },
     }

您应该有一个 config.rb 文件，因为 Compass 不会将某些选项公开为命令行参数。

config.rb

http_images_path = "http://cdn.example.com/images/"

此外，在您的 sass/scss 文件中，不要忘记使用Compass 忽略 url()image_url('hello.jpg')而不是 only 。url('hello.jpg')

下次运行时，grunt compass:dist您会将 url 烘焙到生成的 css 文件中。

于 2013-05-07T04:56:54.230 回答