我应该将一般应用程序配置放在 Gatsby 项目中的什么位置？答案

【问题标题】：Where should I put general app config in a Gatsby project?我应该将一般应用程序配置放在 Gatsby 项目中的什么位置？
【发布时间】：2020-08-10 16:00:20
【问题描述】：

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

无论当前页面如何，我都希望在整个项目中运行一些通用配置 - 例如：

import { enableMapSet, enableES5 } from "immer";

enableMapSet();
enableES5();

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

【问题讨论】：

【解决方案1】：

在 Gatsby 中，本身没有一个配置文件。 Gatsby 公开了几个 API，可让您配置网站的特定部分。

要运行一组函数而不考虑页面，您可以使用gatsby-browser.js（放置在项目的根目录中）。

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

onClientEntry

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

在 Gatsby 浏览器运行时首次启动时调用。

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

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


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

上面的sn-p会在每个页面上触发enableMapSet()和enableES5()。

【讨论】：