Gatsby 重定向到主页而不是显示 404 页面

Question

是否可以通过某种方式将用户重定向到主页 (/) 而不是显示 404 页面？

Answer 1

Gatsby 从 src/pages/404.jsx（或者 404.js 如果你没有使用 jsx 扩展）创建 404 页面。因此，创建一个重定向到主页的组件应该可以做到这一点，就像这样：

import React from 'react';

export default function NotFound() {
  if (typeof window !== 'undefined') {
    window.location = '/';
  }

  return null;
}

Answer 2

您可以执行以下操作：

import React from 'react'
import { Redirect } from '@reach/router'

const NotFoundPage = () => <Redirect to="/" />

export default NotFoundPage

Answer 3

此处的其他答案最终会失败，因为 window 对象未在构建时定义。改用这个。 useEffect 挂钩等同于 componentDidMount.

import { useEffect } from 'react';
import { navigate } from "@reach/router"

export default () => {
  useEffect(() => {
    navigate('/your-redirect/');
  }, []);
  return null;
};

Answer 4

您也可以使用 navigate()（以前是 navigateTo()，感谢@pgarciacamou）

import React from 'react'
import { navigate } from 'gatsby'

const NotFoundPage = () => {
  return navigate('/')
}

export default NotFoundPage

Gatsby 重定向到主页而不是显示 404 页面

Gatsby redirect to home page instead of displaying 404 page

gatsby