SvelteKit.next 靜態站點適配器頁面在刷新時返回 404

Question

我知道這不會那么難，但谷歌搜索沒有找到任何答案。 我正在使用 SvelteKit 靜態站點適配器，它正在構建站點，但構建文件結構是：

root
  - _app
  - faviceon.png
  - index.html
  - secondpage.html

但是，當您單擊導航項將您帶到二級頁面時，URL 是： url.com/secondpage而不是url.com/secondpage.html 。 我假設生成的 JS 在這里做路由，但是如果你直接輸入 url 或刷新第二頁，它會返回 404。

我知道這一定是一個配置問題，但我已經嘗試了很多變體，並且構建保持不變。 這是我的svelte.config.js文件：

// import adapter from "@sveltejs/adapter-auto";
import adapter from "@sveltejs/adapter-static";
import preprocess from "svelte-preprocess";

/** @type {import('@sveltejs/kit').Config} */
const config = {
    // Consult https://github.com/sveltejs/svelte-preprocess
    // for more information about preprocessors
    preprocess: preprocess({
        scss: {
            prependData: `@import './src/lib/scss/style.scss';`,
        },
    }),

    kit: {
        adapter: adapter({
            // default options are shown. On some platforms
            // these options are set automatically — see below
            pages: "build",
            assets: "build",
            fallback: null,
            precompress: false,
            trailingSlash: 'always',
        }),
    },
};

export default config;

我最初沒有 trailingSlash 參數，但文檔和 StackOverflow 上的一些相關內容看起來可能會影響路由代碼生成。

不管怎樣，如果您需要我提供任何其他代碼示例，或者只是只見樹木不見森林，請告訴我。

謝謝！

Answer 1

我發現了同樣的情況，我發現我應該在 src/routes/+layout.js 中放一行

export const trailingSlash = 'always'

Answer 2

問題是，當有多個頁面時，靜態適配器會生成多個 html 文件，並期望所有鏈接都是靜態的。 這些路由，即使它們是靜態的，也會被靜態適配器視為動態的，並且當設置了prerender: true時它會抱怨。

適配器靜態有兩種不同的操作模式：SPA 和預渲染。 當有多個路由時， npm run dev和npm run preview都按預期工作，但是一旦構建，靜態路由就會落到 Web 服務器上，如果沒有.html就無法找到頁面。

我找到了避免將站點轉換為 SPA 的解決方法：安裝 url 重寫機制作為中間件，以便在編譯后的站點中添加靜態服務器期望的.html擴展名。

對於 Nginx 靜態服務器，解決方案是 url 重寫配置，如下所述： https ://www.codesmite.com/article/clean-url-rewrites-using-nginx 對於其他服務器，解決方案應該非常相似