禁用将嵌入背景图像导入到CSS中

我的custom.css.scss文件中有一些字体和@ font-face和背景图片。当我预编译Heroku的资产时，我的生产CSS大于10MB，这使我的网站变慢。经过进一步检查，我发现图像和字体在生成的生产css文件中以base64编码。我如何禁用此功能？禁用将嵌入背景图像导入到CSS中

一些代码custom.css.scss：

@font-face { 
    font-family: 'OpenSansCondensedLight'; 
    src: asset-data-url('opensans-condlight.eot'); 
    src: asset-data-url('opensans-condlight.eot') format('embedded-opentype'), 
     asset-data-url('opensans-condlight.woff') format('woff'), 
     asset-data-url('opensans-condlight.ttf') format('truetype'), 
     asset-data-url('opensans-condlight.svg') format('svg'); 
     font-variant: normal; 
    font-weight: normal; 
    font-style: normal; 
}

成为生产CSS文件：

@font-face { 
    font-family: 'OpenSansCondensedLight'; 
    src: url(data:application/vnd.ms-fontobject;base64,nM8BALTOAQABAAIAAAAAAAILAwYDBQQCAgQBACwB... 
    src: url(data:application/vnd.ms-fontobject;base64,nM8BALTOAQABAAIAAAAAAAILAwYDBQQCAgQBACwB... 
    font-variant: normal; 
    font-weight: normal; 
    font-style: normal; }

来源

2013-10-20 user626873

你是什么意思当你说你在SCSS中有一些字体和背景时？你可以发布你的包括？ –

是的，一些代码会很好:) –

你试过“asset-url（'opensans-condlight.eot'）;”而不是“资产数据网址”？ –

如果使用asset-data-url青菜会内联资产为base64数据。这就是整个问题。

你需要使用asset-path($relative-asset-path, $asset-class)或类似的方法来从你的CSS文件中引用的资产：https://github.com/rails/sass-rails#features

如果没有在Heroku上工作，一定要检查所有的配置：https://devcenter.heroku.com/articles/rails-asset-pipeline

来源

2013-10-21 13:34:31 phoet

是的，我想通了。只是没有一个助手似乎与heroku合作。我最终将原始图像放在公共文件夹中。 – user626873

禁用将嵌入背景图像导入到CSS中

回答

相关问题