0

我有一个基于 myuser.github.io 的 github pages svelte 应用程序 - 它可以工作。

我还基于一个项目（sveltekit）创建了一个 github 页面，所以 url 是 myuser.github.io/sveltekit。设置 repo 以便从 gh-pages 和 root 提供 github 页面。这只是一种作品（！）

问题是导航。这是 __layout.svelte 中的导航代码

<nav>
    <a href="/">Home</a>
    <a href="/about">About</a>
    <a href="/settings">Settings</a>
</nav>

但是当我在 github Pages 下运行它时，主页会出现，但其他链接显示为 myuser/github.io/about，这将给出 404。

如果代码是

<nav>
    <a href="./">Home</a>
    <a href="./about">About</a>
    <a href="./settings">Settings</a>
</nav>

然后其他链接工作一次，然后是例如 myuser.github.io/about/settings ，这又是一个 404。

因此，尽管 github 页面允许我在顶层下拥有子存储库，但它们的导航是基于顶层的根目录，而不是根被定义为该存储库的根目录。唯一的选择是 root 和 /docs。

有没有办法将 root 设置为 /sveltekit/ ？

另一个问题是样式会显示在 github 页面上，尽管当站点在 preview 或 dev 下运行时会显示。

4

1 回答 1

0

我做了两个改变

套件中的 svelte.config.js

        paths: {
            base: '/sveltekit',
            assets: '/sveltekit'
        },

并在 __layout.svelte

<script>
  import { base } from '$app/paths';
</script>

<nav>
    <a href="{base}/">Home</a>
    <a href="{base}/about">About</a>
    <a href="{base}/settings">Settings</a>
</nav>

现在导航工作，我也得到了造型。

于 2021-07-23T05:30:28.643 回答