无法使用 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 应用程序的主要内容,如果未能解决你的问题,请参考以下文章
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)