/docs 中所有页面的简短 HTTP 404 错误
Brief HTTP 404 error on all pages in /docs
我最近第一次部署了我们的 Docusaurus 站点,我 运行 遇到了一个奇怪的路由问题。
/docs 文件夹中的每个页面在直接点击页面时都会短暂呈现 404.html 页面。但是,如果我在边栏中四处点击,页面就会正确呈现。
这只发生在 /docs 文件夹中。如果我点击主页 link 我没有看到 404。
我无法在本地复制这个问题。我已经尝试了 yarn start
和 yarn build/serve
,在这两种情况下应用程序都运行良好。我没有看到任何 404、控制台错误等。404 的响应负载是 OOTB Docusaurus 页面,我没有对其进行任何自定义或如何处理它。
附件是显示行为的 gif 和显示浏览器在我的非本地主机环境中看到硬 404 的屏幕截图。
这是我的配置文件:
// @ts-check
// Note: type annotations allow type checking and IDEs autocompletion
const lightCodeTheme = require('prism-react-renderer/themes/github');
const darkCodeTheme = require('prism-react-renderer/themes/dracula');
/** @type {import('@docusaurus/types').Config} */
const config = {
title: 'Guidebook',
tagline: 'Engineering Information',
url: 'https://guidebook.our-internal-domain.tools/',
baseUrl: '/',
onBrokenLinks: 'throw',
onBrokenMarkdownLinks: 'throw',
favicon: 'img/favicon.png',
organizationName: 'Guidebook',
projectName: 'Guidebook',
presets: [
[
'classic',
/** @type {import('@docusaurus/preset-classic').Options} */
({
docs: {
sidebarPath: require.resolve('./sidebars.js'),
editUrl: 'https://git.our-internal-domain.com/tech-standards/tech-guidebook'
},
blog: false,
theme: {
customCss: require.resolve('./src/css/custom.css')
}
// debug: true
})
]
],
themeConfig: {
navbar: {
title: 'Home',
logo: {
alt: 'Home',
src: 'img/TechnologyGuidebook-Icon_Red_Small.svg'
},
items: [
{
type: 'doc',
docId: 'intro',
position: 'left',
label: 'Guidebook'
},
{
href: 'https://git.our-internal-domain.com/tech-standards/tech-guidebook',
label: 'GitHub',
position: 'right'
}
]
},
footer: {
style: 'dark',
links: [
{
title: 'Community',
items: [
{
label: 'Stack Overflow',
href: 'https://whosebug.com/questions/tagged/docusaurus'
}
]
},
{
title: 'More',
items: [
{
label: 'GitHub',
href: 'https://github.com/facebook/docusaurus'
}
]
}
],
copyright: `Copyright © ${new Date().getFullYear()} Guidebook V2, Inc. Built with Docusaurus.`
},
prism: {
theme: lightCodeTheme,
darkTheme: darkCodeTheme
}
}
};
module.exports = config;
我想通了。这不是 Docusaurus 的问题。问题是我们的 CloudFront 基础架构中的配置问题。
我最近第一次部署了我们的 Docusaurus 站点,我 运行 遇到了一个奇怪的路由问题。
/docs 文件夹中的每个页面在直接点击页面时都会短暂呈现 404.html 页面。但是,如果我在边栏中四处点击,页面就会正确呈现。
这只发生在 /docs 文件夹中。如果我点击主页 link 我没有看到 404。
我无法在本地复制这个问题。我已经尝试了 yarn start
和 yarn build/serve
,在这两种情况下应用程序都运行良好。我没有看到任何 404、控制台错误等。404 的响应负载是 OOTB Docusaurus 页面,我没有对其进行任何自定义或如何处理它。
附件是显示行为的 gif 和显示浏览器在我的非本地主机环境中看到硬 404 的屏幕截图。
这是我的配置文件:
// @ts-check
// Note: type annotations allow type checking and IDEs autocompletion
const lightCodeTheme = require('prism-react-renderer/themes/github');
const darkCodeTheme = require('prism-react-renderer/themes/dracula');
/** @type {import('@docusaurus/types').Config} */
const config = {
title: 'Guidebook',
tagline: 'Engineering Information',
url: 'https://guidebook.our-internal-domain.tools/',
baseUrl: '/',
onBrokenLinks: 'throw',
onBrokenMarkdownLinks: 'throw',
favicon: 'img/favicon.png',
organizationName: 'Guidebook',
projectName: 'Guidebook',
presets: [
[
'classic',
/** @type {import('@docusaurus/preset-classic').Options} */
({
docs: {
sidebarPath: require.resolve('./sidebars.js'),
editUrl: 'https://git.our-internal-domain.com/tech-standards/tech-guidebook'
},
blog: false,
theme: {
customCss: require.resolve('./src/css/custom.css')
}
// debug: true
})
]
],
themeConfig: {
navbar: {
title: 'Home',
logo: {
alt: 'Home',
src: 'img/TechnologyGuidebook-Icon_Red_Small.svg'
},
items: [
{
type: 'doc',
docId: 'intro',
position: 'left',
label: 'Guidebook'
},
{
href: 'https://git.our-internal-domain.com/tech-standards/tech-guidebook',
label: 'GitHub',
position: 'right'
}
]
},
footer: {
style: 'dark',
links: [
{
title: 'Community',
items: [
{
label: 'Stack Overflow',
href: 'https://whosebug.com/questions/tagged/docusaurus'
}
]
},
{
title: 'More',
items: [
{
label: 'GitHub',
href: 'https://github.com/facebook/docusaurus'
}
]
}
],
copyright: `Copyright © ${new Date().getFullYear()} Guidebook V2, Inc. Built with Docusaurus.`
},
prism: {
theme: lightCodeTheme,
darkTheme: darkCodeTheme
}
}
};
module.exports = config;
我想通了。这不是 Docusaurus 的问题。问题是我们的 CloudFront 基础架构中的配置问题。