图像的相对路径受到 routify 中嵌套路由的影响
relative path of image gets affected by nested routes in routify
我在 routify 中有一个具有以下文件夹结构的嵌套路由,其中图像放置在 public 文件夹中并在此处引用,我正在使用 App.svelte 中的图像。一切正常。当我转到示例时。com/1/2 相对路径无法正常工作
public
--assets
--images
--image.png
src
--pages
--[aid]
--[bid].svelte
--_layout.svelte
App.svelte
App.svelte
<img src="./assets/images/zrx-logo.png" />
这就是我在 App.svelte
中引用图像的方式
错误
GET http://localhost:5000/1/assets/images/image.png 404 (Not Found) 就是这样解决的
而不是 http://localhost:5000/assets/images/image.png.
P.S 当 URL 是示例时。com/1 图像得到正确解析
您应该使用绝对路径:/
(不带点)。 ./
表示当前文件夹。因此,在 http://localhost:5000/1
当前文件夹是网站的根目录,即 public
文件夹,转换为 /public
./
在 http://localhost:5000/1/2
表示 /public/1
要解决您的问题,请将路径设置为 /assets/images/zrx-logo.png
这意味着我们开始直接从根文件夹 (/public
)
中查找文件
我在 routify 中有一个具有以下文件夹结构的嵌套路由,其中图像放置在 public 文件夹中并在此处引用,我正在使用 App.svelte 中的图像。一切正常。当我转到示例时。com/1/2 相对路径无法正常工作
public
--assets
--images
--image.png
src
--pages
--[aid]
--[bid].svelte
--_layout.svelte
App.svelte
App.svelte
<img src="./assets/images/zrx-logo.png" />
这就是我在 App.svelte
中引用图像的方式错误
GET http://localhost:5000/1/assets/images/image.png 404 (Not Found) 就是这样解决的 而不是 http://localhost:5000/assets/images/image.png.
P.S 当 URL 是示例时。com/1 图像得到正确解析
您应该使用绝对路径:/
(不带点)。 ./
表示当前文件夹。因此,在 http://localhost:5000/1
当前文件夹是网站的根目录,即 public
文件夹,转换为 /public
./
在 http://localhost:5000/1/2
表示 /public/1
要解决您的问题,请将路径设置为 /assets/images/zrx-logo.png
这意味着我们开始直接从根文件夹 (/public
)