CSS中的图像路径支持CDN

jha*_*fen 13 css cdn sass

我正在尝试将我们的图像部署到cdn.目前,css具有我们网站上图像的相对路径.这些路径需要支持CDN图像位置.有没有人有关于我如何做到这一点的建议?

或者,如果有人有关于部署到CDN的好教程.


这就是我最终实现这一目标的方式.

  1. 我用过SASS - http://sass-lang.com/
  2. 我有一个名为cdn.scss的mixin,其内容类似于$ image_path:"/ images /";
  3. 以sass样式导入mixin @import"cdn.scss"
  4. 像这样更新图像路径:background:url($ image_path +"image.png");
  5. 在部署时,我更改mixin.scss中的$ image_path变量,然后重新运行sass

UPDATE

我们使用bash来更新文件

cat > preprocess/sass/_cdn.scss <<EOT
\$image_path: "//CDN_URL/";
Run Code Online (Sandbox Code Playgroud)

_cdn.scss中的示例代码

$image_path: "/public/images/";
Run Code Online (Sandbox Code Playgroud)

然后它在本地默认工作,但在生产推送时,我们运行bash脚本以使用cdn位置进行更新

wsa*_*lle 16

可能最简单的方法是在CDN上托管你的图像和CSS文件.CSS文件中的图像路径与CSS文件本身相关,因此您根本不必更改CSS.

如果这不是一个选项,那么您就会将完全限定的URL放在样式表中.现在,如果您真的想要,您可以动态生成CSS文件,并执行一些替换,这样您实际上不必在工作表中硬编码CDN.