私は使用してGatsby
おり、多言語を使用して 1 つのサイトを作成したいと考えています。これまでのところ、これpages/index.js
を含むものを定義しました:
import React from "react"
import Layout from "../components/layout/layout"
import BGTState from "../context/bgt/bgtState"
import { Router } from "@reach/router"
import Home from "../components/pages/home"
import Collection from "../components/pages/collection"
import NotFound from "../components/pages/404"
const IndexPage = () => {
return (
<BGTState>
<Layout>
<Router>
<Home path="/" />
<Collection path="collection/:id" />
<NotFound default />
</Router>
</Layout>
</BGTState>
)
}
export default IndexPage
そして私は次のように変更gatsby-node.js
しました:
// Implement the Gatsby API onCreatePage. This is
// called after every page is created.
exports.onCreatePage = async ({ page, actions }) => {
const { createPage } = actions
if (page.path === "/") {
page.matchPath = "/*"
createPage(page)
}
}
各リクエストは に転送されindex.js
ますが、問題があります。gatsby-plugin-intl
次のような動的プレフィックスを URL に追加するプラグインを使用しています。http://localhost:3001/en/
にアクセスすると、URL に一致するルートがないためhttp://localhost:3001/en/
、コンポーネントが表示されます。NotFound
URL にプレフィックスを付けて、すべてを正しいコンポーネントに再ルーティングする方法はありますか?