我应该将常规应用程序配置放在 Gatsby 项目的什么位置？

Question

我是 Gatsby 的新手，但熟悉 CRA。我正在使用由 Gatsby CLI 运行ning gatsby new <project_name> 生成的默认 Gatsby 设置。

我有一些我想要在我的整个项目中运行的通用配置，无论当前页面如何 - 例如：

import { enableMapSet, enableES5 } from "immer";

enableMapSet();
enableES5();

在 CRA 项目中，我将这些东西放在 App.tsx 中，但无法确定在 Gatsby 项目中的正确位置。

Answer 1

在 Gatsby 中，您没有一个配置文件本身。 Gatsby 公开了多个 API，允许您配置站点的特定部分。

要运行一套功能不管页面你可以用一个gatsby-browser.js（放在项目根目录）。

基本上，Gatsby 公开了一组 API，可让您响应浏览器中的操作，并将您的站点包装在其他组件中。 Gatsby Browser API 为您提供了许多与 Gatsby 的 client-side 交互的选项。其中之一 onClientEntry 符合您的要求。来自其文档：

onClientEntry

(_: emptyArg, pluginOptions: pluginOptions) => undefined

Called when the Gatsby browser runtime first starts.

应用于您的代码，您的 gatsby-browser.js 应该如下所示：

import { enableMapSet, enableES5 } from "immer";
import React from 'react';


export const onClientEntry = () =>{
  enableMapSet();
  enableES5();
};

上面的代码片段将在每个页面上触发 enableMapSet() 和 enableES5()。

Where should I put general app config in a Gatsby project?