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

Question

是否可以通过某种方式将用户重定向到首页（/），而不是显示404页面？

Answer 1

此处的其他答案最终将失败，因为window在构建时未定义对象。改用它。所述useEffect钩相当于componentDidMount。

import { useEffect } from 'react';
import { navigate } from 'gatsby';

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

Answer 2

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 3

您可以执行以下操作：

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

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

export default NotFoundPage

Answer 4

你也可以用navigate()（以前navigateTo()，谢谢@pgarciacamou）

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

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

export default NotFoundPage