遮蔽组件时如何处理进口

编程问答 2022-08-23

问题描述

当遮盖Gatsby主题时，如何处理对不需要任何更改的组件的导入调用。根据我的理解，如果要添加阴影，则目录中应该存在的唯一文件是您要更改的组件的源代码。

例如在原始index.js中，我具有以下导入

import { graphql } from "gatsby"
import React from "react"
import CustomFonts from "../components/custom-fonts/custom-fonts"
import Footer from "../components/footer/footer"
import Header from "../components/header/header"
import SEO from "../components/SEO/SEO"
import Sidebar from "../components/sidebar/sidebar"
import "../styles/style.css"

如果我想隐藏index.js，我将如何导入这些组件？还是所有进口商品都必须在本地存在？

我认为这是与此相关的盖茨比文档？ https://www.gatsbyjs.org/docs/themes/shadowing/#extending-shadowed-files，但阅读后仍然有些困惑。

任何帮助将不胜感激

解决方法

这真是一个愚蠢的问题，只需使用gatsby-config.js下的插件解决路径

,

@CrustyWang 的回答是正确的......但这里是如何在代码中做到这一点。

假设您的 GoogleCredential credential = new GoogleCredential.Builder().setTransport(HTTP_TRANSPORT) .setJsonFactory(JSON_FACTORY) .setServiceAccountId(SERVICE_ACCOUNT_EMAIL) .setServiceAccountScopes(CalendarScopes.CALENDAR) .setServiceAccountPrivateKeyFromP12File(credsPath)) .setServiceAccountUser(gsuiteUser) .build(); 中有一个模块 fontcula，它在路径上具有以下样式文件 - node_modules

  • index.ts
  • global.ts
  • media.ts

index.ts 在哪里 -

node_modules/fontcula/src/styles/

假设我们要在文件 import { media } from "@styles/media"; export { globalStyles,media }; 中添加一组新字体，我们希望从 index.ts 导出该文件。为此，我们需要执行以下操作 -

  1. 在路径 fonts.ts 上添加 font.ts 并添加需要添加的任何内容....

  2. 在相同的路径上重新创建 index.ts 为 -

project_folder/src/fontula/styles

你可以走了。

执行部分从 import { globalStyles } from "fontcula/src/styles/global"; import { media } from "fontcula/src/styles/media"; import { fonts } from "./fonts" export { globalStyles,fonts,media }; 文件夹中的源中提取 globalStyles 和 media

gatsby