WebStorm 中无法识别 GraphQL 模式

Question

我正在开发 Shopify 管理 UI 扩展的存储库（我认为该存储库是由某些 Shopify CLI 生成的），并使用

gql

在模板字符串内编写 GraphQL 格式的查询。但 WebStorm 似乎无法识别该架构。

我们的根目录下确实有一个

.graphqlrc.ts

文件

import fs from "fs";
import { LATEST_API_VERSION } from "@shopify/shopify-api";
import { shopifyApiProject, ApiType } from "@shopify/api-codegen-preset";
import type { IGraphQLConfig } from "graphql-config";

function getConfig() {
  const config: IGraphQLConfig = {
    projects: {
      default: shopifyApiProject({
        apiType: ApiType.Admin,
        apiVersion: LATEST_API_VERSION,
        documents: ["./app/**/*.{js,ts,jsx,tsx}"],
        outputDir: "./app/types",
      }),
    },
  };

  let extensions: string[] = [];
  try {
    extensions = fs.readdirSync("./extensions");
  } catch {
    // ignore if no extensions
  }

  for (const entry of extensions) {
    const extensionPath = `./extensions/${entry}`;
    const schema = `${extensionPath}/schema.graphql`;
    if (!fs.existsSync(schema)) {
      continue;
    }
    config.projects[entry] = {
      schema,
      documents: [`${extensionPath}/**/*.graphql`],
    };
  }

  return config;
}

module.exports = getConfig();

WebStorm 中的 GraphQL 窗格发现了一些东西：

但是搜索“架构发现摘要”只能找到

Boolean

等基本内容，而不是

CollectionInput

等 Shopify 内容或类似内容。

graphqlrc.ts

是否设置正确以获取所有 Shopify API 信息？ （当我运行

dev

(

"shopify app dev -c shopify.app.dev.toml"

) 并转到 GraphQL 门户时，所有 API 都在那里，FWIW。

Answer 1

在文件中

.graphqlrc.ts

更改

module.exports = getConfig();

到

export default getConfig();

然后在

Schemas and Project Structure

选项卡中单击根图标，然后按

Restart Schema discovery

按钮。