Css 当根位置不同时，如何访问angular solution中的assets文件夹

我的assets/css文件夹中有一个css文件，需要访问assets/fonts文件夹中的一些字体。我可以通过编写url（'/assets/fonts/myfont.svg'）使它在本地主机上工作

在服务器上，这不起作用，因为指向我的站点根目录的路径是mydomain.com/myapp/。我把基地从改成了

然后我试过：

• url（'assets/font/myfont.svg'）
• url（“~assets/fonts/myfont.svg”）
• url（“./assets/font/myfont.svg”）

但是解决方案将无法编译（无法解析“assets/fonts/myfont.svg”）

---

非常感谢

你能试试这个url吗

~src/assets/fonts/myfont.svg

---

这对我来说绝对有效。

您必须在

angular.json

文件中声明所有资产，例如默认情况下声明的资产文件夹。这使您的资产文件夹直接可用，并且在构建过程之后，您会注意到资产在dist文件夹中被转移。然后使用您将要编写的资产中的任何内容

/assets/img.png

。前面的斜杠告诉链接从根目录获取目录，而

assets/img.png

有时可以从当前目录进行解释。

您必须检查

angular.json

，然后像这样更改资产根目录

"assets": [
              "src/favicon.ico",
              "src/assets"
            ],

以及以下项目下的源根目录：

"sourceRoot": "src",

---

这仅适用于angular cli中的webpack解析所有相对路径和绝对路径，以便与dist文件夹中的捆绑应用程序文件一起使用。使用路径~src/assets/fonts/i时，会出现编译错误：（发出的值而不是错误实例）csssyntaxerror但在我的生产服务器上发布时，这不起作用，因为该网站的根url为“mydomain.com/myapp/”（并且基本href从“/”更改为“/myapp/”然后执行

/myapp/assets/img.png

，但它无法在localhostOk上编译或运行。还有一种方法可以解决这个问题，就是更改您的基本url以适应项目，您可以在

index.html

中找到一个引用，但我已经代表网站的根目录更新了index.html中的基本href