无法使用 npm run develop 命令运行 Gatsby 应用程序

Posted

技术标签:

【中文标题】无法使用 npm run develop 命令运行 Gatsby 应用程序【英文标题】:Unable to run Gatsby application using npm run develop command 【发布时间】:2020-06-22 02:21:07 【问题描述】:

我正在使用 Gatsby 和 prismic 开发我的第一个项目。今天,当我尝试启动我的开发服务器时,我遇到了这个错误。我进行了搜索,但在任何地方都找不到类似的错误。我完全被这个问题阻止了,不知道是什么导致了这个错误。

从 package.json 中提取:

"scripts": 
    "build-dev": "env-cmd -f .env gatsby build",
    "develop-dev": "env-cmd -f .env gatsby develop",
      ....
  ,

错误

ERROR 

UNHANDLED REJECTION Union type PrismicAllDocumentTypes must define one or more member types.



  Error: Union type PrismicAllDocumentTypes must define one or more member types.

  - query-compiler.js:202 extractOperations
    [site]/[gatsby]/dist/query/query-compiler.js:202:20

  - query-compiler.js:176 processQueries
    [site]/[gatsby]/dist/query/query-compiler.js:176:7

  - query-compiler.js:96 compile
    [vav_site]/[gatsby]/dist/query/query-compiler.js:96:19

  - index.js:484 async module.exports
    [site]/[gatsby]/dist/bootstrap/index.js:484:3

  - develop.js:446 async module.exports
    [site]/[gatsby]/dist/commands/develop.js:446:7


not finished extract queries from components - 0.675s
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! gatsby-starter-default@0.1.0 develop-dev: `env-cmd -f .env gatsby develop`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the gatsby-starter-default@0.1.0 develop-dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Internal\AppData\Roaming\npm-cache\_logs\2020-03-10T07_36_38_243Z-debug.log
The terminal process terminated with exit code: 1

盖茨比版本:2.19.34 反应版本:16.13.0 prismic-reactjs 版本:1.2.0

【问题讨论】:

【参考方案1】:

你安装了吗npm install -g gatsby-cli

[更新] Prismic 不再推荐gatsby-source-prismic-graphql 插件。

这里有一篇文章可以帮助您迁移到另一篇文章:

How to migrate a project from 'gatsby-source-prismic' to 'gatsby-source-prismic-graphql'

【讨论】:

【参考方案2】:

错误表示 PrismicAllDocumentTypes 没有子级。您需要检查您的 prismic repo 是否具有至少一种内容类型,最重要的是,您至少已将一种模式添加到您的代码库和 gatsby-config.js:

module.exports = 
  plugins: [
    
      resolve: `gatsby-source-prismic`,
      options: 
        repositoryName: `repositoryName`,
        accessToken: `accessToken`,
        linkResolver: ( node, key, value ) => post => `/$post.uid`,
        schemas: 
          page: require("./src/schemas/page.json"),
        ,
      ,
    ,
  ],

【讨论】:

【参考方案3】:

使用我自己的棱镜源 gatsby package.json 文件:


  "name": "gatsby-VARIABLE-prismic",
  "description": "YOUR DESCRIPTION",
  "private": true,
  "license": "MIT",
  "version": "0.0.0",
  "author": "YOURNAME <YOUR@EMAIL.ADDRESS> (@USERNAME)",
 "scripts": 
    "build": "gatsby build",
    "dev": "gatsby develop -o",
    "develop": "gatsby develop",
    "serve": "gatsby serve",
    "lint": "eslint . --ext .js,.jsx --ignore-path .gitignore",
    "lint:fix": "eslint . --ext .js,.jsx --fix --ignore-path .gitignore",
    "lint:ci": "yarn lint --format junit -o results/eslint/result.xml",
    "format": "prettier \"**/*.md \" --write",
    "cy:open": "cypress open",
    "cy:run": "cypress run",
    "cy:run:ci": "cypress run --browser chrome --reporter junit --reporter-options 'mochaFile=results/cypress/result.xml'",
    "test:e2e:dev": "cross-env CYPRESS_SUPPORT=y start-server-and-test dev http://localhost:8000 cy:open",
    "test:e2e:run": "cross-env CYPRESS_SUPPORT=y start-server-and-test develop http://localhost:8000 cy:run",
    "test:e2e:ci": "cross-env CYPRESS_SUPPORT=y start-server-and-test develop http://localhost:8000 cy:run:ci"
  ,
  "dependencies": 
    "@emotion/core": "^10.0.28",
    "@emotion/styled": "^10.0.27",
    "@emotion/styled-base": "^10.0.28",
    "@reach/skip-nav": "^0.8.5",
    "emotion": "^10.0.27",
    "emotion-server": "^10.0.27",
    "emotion-theming": "^10.0.27",
    "gatsby": "^2.19.23",
    "gatsby-image": "^2.2.41",
    "gatsby-plugin-emotion": "^4.1.22",
    "gatsby-plugin-google-analytics": "^2.1.36",
    "gatsby-plugin-lodash": "^3.1.20",
    "gatsby-plugin-manifest": "^2.2.42",
    "gatsby-plugin-netlify": "^2.1.33",
    "gatsby-plugin-offline": "^3.0.35",
    "gatsby-plugin-react-helmet": "^3.1.22",
    "gatsby-plugin-sharp": "^2.4.5",
    "gatsby-plugin-sitemap": "^2.2.27",
    "gatsby-plugin-typography": "^2.3.22",
    "gatsby-source-prismic": "^2.2.0",
    "gatsby-transformer-sharp": "^2.3.16",
    "lodash": "^4.17.15",
    "prismic-dom": "^2.1.0",
    "prismjs": "^1.19.0",
    "prop-types": "^15.7.2",
    "react": "^16.13.0",
    "react-dom": "^16.13.0",
    "react-helmet": "^5.2.1",
    "react-typography": "^0.16.19",
    "typeface-lora": "^0.0.72",
    "typeface-source-sans-pro": "^1.1.5",
    "typography": "^0.16.19"
  ,
  "devDependencies": 
    "@testing-library/cypress": "^5.1.2",
    "babel-eslint": "^10.1.0",
    "cross-env": "^7.0.0",
    "cypress": "^3.8.3",
    "eslint": "^6.8.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-prettier": "^6.10.0",
    "eslint-plugin-cypress": "^2.10.3",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-prettier": "^3.1.2",
    "eslint-plugin-react": "^7.18.3",
    "eslint-plugin-react-hooks": "^2.5.0",
    "gatsby-cypress": "^0.2.22",
    "prettier": "^1.19.1",
    "start-server-and-test": "^1.10.9"
  ,
  "keywords": [
    "gatsby",
    "starter",
    "prismic",
    "typography",
    "minimal",
    "gatsby-starter"
  ]

在你的 gatsby-condig.js 中:

 resolve: 'gatsby-source-prismic',
      options: 
        repositoryName: 'gatsby-starter-prismic',
        accessToken: `$process.env.API_KEY`,
        // Get the correct URLs in blog posts
        linkResolver: () => post => `/$post.uid`,
        // PrismJS highlighting for labels and slices
        htmlSerializer: () => prismicHtmlSerializer,
        // Remove this config option if you only have one language in your Prismic repository
        lang: 'en-gb',
      ,
    ,

您可能正在使用 .dotenv - 一种在公共 ic 存储库之外传递密钥的方法。

在你的根目录中创建一个名为“.env.develop”的文件和第二个:“.env.prod”

.env.develop 文件内容: API_KEY = COPYPASE YOUR API KEY HERE

【讨论】:

以上是关于无法使用 npm run develop 命令运行 Gatsby 应用程序的主要内容,如果未能解决你的问题,请参考以下文章

CircleCI 没有运行“npm run”命令

webpack4学习记录运行npm run dev 报错npm ERR! Failed at the webpacktest@1.0.0 dev script.

webpack4学习记录运行npm run dev 报错npm ERR! Failed at the webpacktest@1.0.0 dev script.

webpack4学习记录运行npm run dev 报错npm ERR! Failed at the webpacktest@1.0.0 dev script.

无法在 Laravel 项目中使用 deploy.sh 文件运行“npm run prod”(使用 Laravel Mix)

vuenpm run mock & npm run dev 无法同时运行的解决