在 HTML 中动态引用静态资源

Question

为了引用一个css文件style.css，我们把它写成

<link rel="stylesheet" type="text/css" href="../abc/xyz/css/style.css">

图像处理方式与

<img src="../abc/xyz/img/myimage.png" />

对于所有静态资源，路径都是硬编码的。如果目录结构发生变化，它将产生问题。 是否可以包含诸如

之类的资产

<link rel="stylesheet" type="text/css" href="{{assetsDirectory}}/css/style.css">
<img src="{{assetsDirectory}}/img/myimage.png" />

在应用程序的某个地方，我将 config.json 文件中的配置指定为

{
  "assetsDirectory" : "../abc/xyz",
  "anyotherproperty" : "anyotherpropertyvalue"
}

编辑： 将以上内容视为一个项目 这个项目可以被其他B项目使用所以我希望配置文件由B项目指定。

Answer 1

你可以使用“变量插值”

@base-url: "http://assets.yourdomain.com/abc/xyz";
background-image: url("@{base-url}/image.png");