Как сделать многоязычный статический сайт, используя gatsby-plugin-intl и gatsby markdown?
Я пытаюсь создать статический сайт с помощью gatsby, который поддерживает два языка, я хочу, чтобы весь контент обрабатывался файлами разметки.
Я начал с plugin-gatsby-intl, используя этот https://www.gatsbyjs.org/packages/gatsby-plugin-intl/ - отлично работает.
но я не могу понять, как использовать уценку, я думаю, потому что gatsby-plugin-intl меняет пути. когда я пытаюсь перейти на localhost:8000/blog, он меняется на localhost:8000/en/blog и вызывает ошибку, которая в шаблоне, который запрос graphql возвратил null.
Я понимаю проблему, но не могу понять, как ее решить. Я думаю, мне нужно сделать 2 файла уценки по одному для каждого языка и изменить gatsby-node.js, чтобы правильно управлять путями, но не знаю, как это сделать. Единственная информация, которую я нашел в Интернете, это https://hiddentao.com/archives/2019/05/07/building-a-multilingual-static-site-with-gatsby, но после его шагов я не работаю
буду признателен за любую помощь
мой gatsby-node.js:
const path = require(`path`)
exports.createPages = async ({ actions, graphql, reporter }) => {
const { createPage } = actions
const blogPostTemplate = path.resolve(`src/templates/post.js`)
const result = await graphql(`
{
allMarkdownRemark {
edges {
node {
frontmatter {
path
}
}
}
}
}
`)
// Handle errors
if (result.errors) {
reporter.panicOnBuild(`Error while running GraphQL query.`)
return
}
result.data.allMarkdownRemark.edges.forEach(({ node }) => {
console.log("path:")
console.log(node.frontmatter.path)
createPage({
path: node.frontmatter.path,
component: blogPostTemplate,
context: {}, // additional data can be passed via context
})
})
}
мой шаблон:
// src/templates/post.js
import React from "react"
import { graphql } from "gatsby"
export default function Template({
// this prop will be injected by the GraphQL query below.
data, })
{
console.log(data)
const { markdownRemark } = data // data.markdownRemark holds your post data
const { frontmatter, html } = markdownRemark
return (
<div>
<h1>{frontmatter.title}</h1>
</div>
)
}
//$path which is a strings
export const pageQuery = graphql`
query ($path: String!) {
markdownRemark(frontmatter: { path: { eq: $path } }) {
html
frontmatter {
path
title
}
}
}
`
// )
// .then(res => {
// console.log("result")
// // console.log(pageQuery.data)
// })
и мой blog.md:
---
path: "/blog"
date: "2019-05-04"
title: "My first blog post"
---
this is the my markdown
1 ответ
{
resolve: `gatsby-plugin-intl`,
options: {
path: `${__dirname}/src/locales`,
languages: [`en-us`, `fr`, `pt-br`],
defaultLanguage: `en-us`,
redirect: false,
},
},
Вы можете изменить перенаправление на false.