简体   繁体   English

错误:无法找到插件“gatsby-plugin-React-helmet”

[英]Error: Unable to find plugin "gatsby-plugin-React-helmet"

Well, I have a really hard time trying to build my gatsby website on Netlify.好吧,我真的很难在 Netlify 上建立我的 gatsby 网站。

Locally on my PC, everything seems to work great without a single issue, but once I upload it to Netlify i get this Error:在我的 PC 本地,一切似乎都运行良好,没有任何问题,但是一旦我将其上传到 Netlify,我就会收到此错误:

11:22:50 AM:   Error: Unable to find plugin "gatsby-plugin-React-helmet". Perhaps you need to   install its package?
11:22:50 AM:   
11:22:50 AM:   - load.js:109 resolvePlugin
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/load-plugins/load.js:109:11
11:22:50 AM:   
11:22:50 AM:   - load.js:152 processPlugin
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/load-plugins/load.js:152:20
11:22:50 AM:   
11:22:50 AM:   - load.js:171 config.plugins.forEach.plugin
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/load-plugins/load.js:171:20
11:22:50 AM:   
11:22:50 AM:   - Array.forEach
11:22:50 AM:   
11:22:50 AM:   - load.js:170 module.exports
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/load-plugins/load.js:170:20
11:22:50 AM:   
11:22:50 AM:   - index.js:51 module.exports
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/load-plugins/index.js:51:19
11:22:50 AM:   
11:22:50 AM:   - index.js:122 module.exports
11:22:50 AM:     [repo]/[gatsby]/dist/bootstrap/index.js:122:34

I updated the plugin and even I reinstall it several times but with no luck我更新了插件,甚至我重新安装了几次但没有运气

Here's my package.json file这是我的 package.json 文件

    {
  "name": "gatsby-casper",
  "description": "Casper for gatsby",
  "version": "0.0.0",
  "private": true,
  "author": "Scott Cooper <scttcper@gmail.com>",
  "license": "MIT",
  "scripts": {
    "build": "gatsby build",
    "clean": "rimraf public",
    "dev": "gatsby develop",
    "lint": "eslint src/**/**/*.tsx",
    "lint:fix": "eslint --fix src/**/*/*.tsx",
    "start": "npm run dev",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "@emotion/core": "10.0.14",
    "@emotion/styled": "10.0.14",
    "@emotion/styled-base": "10.0.14",
    "classnames": "2.2.6",
    "cssnano": "4.1.10",
    "emotion": "10.0.14",
    "emotion-server": "10.0.14",
    "gatsby": "2.13.33",
    "gatsby-image": "2.2.6",
    "gatsby-plugin-canonical-urls": "2.1.2",
    "gatsby-plugin-emotion": "4.1.2",
    "gatsby-plugin-feed": "2.3.5",
    "gatsby-plugin-google-analytics": "2.1.4",
    "gatsby-plugin-offline": "^3.0.30",
    "gatsby-plugin-postcss": "2.1.2",
    "gatsby-plugin-react-helmet": "^3.1.2",
    "gatsby-plugin-sharp": "2.2.9",
    "gatsby-plugin-sitemap": "2.2.3",
    "gatsby-plugin-typescript": "2.1.2",
    "gatsby-remark-abbr": "1.0.0",
    "gatsby-remark-copy-linked-files": "2.1.3",
    "gatsby-remark-images": "3.1.7",
    "gatsby-remark-prismjs": "3.3.3",
    "gatsby-remark-responsive-iframe": "2.2.4",
    "gatsby-remark-smartypants": "2.1.2",
    "gatsby-source-filesystem": "2.1.6",
    "gatsby-transformer-json": "2.2.2",
    "gatsby-transformer-remark": "2.6.9",
    "gatsby-transformer-sharp": "2.2.4",
    "gatsby-transformer-yaml": "2.2.3",
    "lodash": "4.17.15",
    "modern-normalize": "0.5.0",
    "normalize.css": "8.0.1",
    "polished": "3.4.1",
    "postcss-color-function": "4.1.0",
    "prism-themes": "1.1.0",
    "prismjs": "1.17.1",
    "react": "16.8.6",
    "react-dom": "16.8.6",
    "react-emotion": "10.0.0",
    "react-helmet": "^5.2.1",
    "rehype-react": "4.0.1"
  },
  "devDependencies": {
    "@types/classnames": "2.2.9",
    "@types/lodash": "4.14.136",
    "@types/node": "12.6.8",
    "@types/react": "16.8.23",
    "@types/react-dom": "16.8.4",
    "@types/react-helmet": "5.0.8",
    "@typescript-eslint/eslint-plugin": "1.13.0",
    "@typescript-eslint/parser": "1.13.0",
    "babel-plugin-styled-components": "1.10.6",
    "eslint": "6.1.0",
    "eslint-config-xo-react": "0.20.0",
    "eslint-config-xo-space": "0.21.0",
    "eslint-config-xo-typescript": "0.15.0",
    "eslint-plugin-import": "2.18.2",
    "eslint-plugin-react": "7.14.3",
    "eslint-plugin-react-hooks": "1.6.1",
    "rimraf": "2.6.3",
    "typescript": "3.5.3"
  },
  "engines": {
    "node": ">=8.0.0"
  }
}

So any ideas about this issue?那么关于这个问题的任何想法?

It looks like somewhere in your code you are referencing gatsby-plugin-React-helmet which has an uppercase "R".看起来您在代码中的某个地方引用了gatsby-plugin-React-helmet ,它有一个大写的“R”。 Search your code and replace with gatsby-plugin-react-helmet .搜索您的代码并替换为gatsby-plugin-react-helmet

gatsby-react-helmet 生成空<title>在 SSR 上&lt;/div&gt;</title><div id="text_translate"><p> 我的 Gatsby 网站没有在 SSR 上生成正确的标题标签。 当我建立网站时,我在生成的文件上得到的只是&lt;title data-react-helmet="true"&gt;&lt;/title&gt; 。 我很感激帮助找到问题并解决,因为经过长时间的调试过程,我不知道哪个可能是问题。</p><p> 相关文件:</p><p> <strong>package.json</strong></p><pre> ... "dependencies": { "gatsby": "^2.19.45", "gatsby-image": "^2.2.44", "gatsby-plugin-manifest": "^2.2.48", "gatsby-plugin-react-helmet": "^3.2.2", "gatsby-plugin-sharp": "^2.4.13", "gatsby-plugin-sitemap": "^2.3.1", "gatsby-plugin-typescript": "^2.3.3", "gatsby-source-filesystem": "^2.1.56", "gatsby-source-graphql": "^2.2.0", "react": "^16.12.0", "react-dom": "^16.12.0", "react-helmet": "^6.0.0", }...</pre><p> <strong>gatsby.config.js</strong></p><pre> plugins: [ `gatsby-plugin-react-helmet`, ... ]</pre><p> <em>(gatsby-plugin-offline 已禁用)</em></p><p> 搜索引擎优化</p><pre>import React from "react" import { Helmet } from "react-helmet" import { useStaticQuery, graphql } from "gatsby" interface Props { title: string description?: string image?: string } const SEO = ({ title, description, image }: Props) =&gt; { const { site } = useStaticQuery( graphql` query { site { siteMetadata { title description image siteUrl } } } ` ) const metaDescription = description || site.siteMetadata.description const shareImage = image || site.siteMetadata.image const url = site.siteMetadata.siteUrl return ( &lt;Helmet defer={false}&gt; &lt;title&gt;{title}&lt;/title&gt; &lt;meta name="description" content={metaDescription} /&gt; &lt;meta name="image" content={shareImage} /&gt; &lt;link rel="canonical" href={url} /&gt; &lt;meta property="og:url" content={url} /&gt; &lt;meta property="og:type" content="website" /&gt; &lt;meta property="og:title" content={title} /&gt; &lt;meta property="og:description" content={metaDescription} /&gt; &lt;meta property="og:image" content={shareImage} /&gt; &lt;meta name="twitter:card" content="summary_large_image" /&gt; &lt;meta name="twitter:title" content={title} /&gt; &lt;meta name="twitter:description" content={metaDescription} /&gt; &lt;meta name="twitter:image" content={shareImage} /&gt; &lt;/Helmet&gt; ) } export default SEO</pre><p> 将&lt;title&gt;{title}&lt;/title&gt;更改为&lt;Helmet title={title}&gt;或删除defer={true}不会改变结果中的任何内容。</p><p> <strong>盖茨比-ssr.js</strong></p><pre> import React from "react" import { Helmet } from "react-helmet" export const onRenderBody = ( { setHeadComponents, setHtmlAttributes, setBodyAttributes }, pluginOptions ) =&gt; { const helmet = Helmet.renderStatic() setHtmlAttributes(helmet.htmlAttributes.toComponent()) setBodyAttributes(helmet.bodyAttributes.toComponent()) setHeadComponents([ helmet.title.toComponent(), helmet.link.toComponent(), helmet.meta.toComponent(), helmet.noscript.toComponent(), helmet.script.toComponent(), helmet.style.toComponent() ]) }</pre><p> <em>我仍然有一个空的 srr 文件的问题。</em></p><p> 在任何给定的页面上,我都会调用 SEO 标签,例如:</p><pre> &lt;SEO title="Hello World" description="Foo Bar" /&gt;</pre></div> - gatsby-react-helmet generating empty <title> on SSR

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 gatsby-plugin-react-svg 导致太多递归错误 - gatsby-plugin-react-svg causing too much recursion error 如何在 Gatsby 插件中使用 React 组件? - How to use a React component inside a Gatsby plugin? 在 React Helmet/ Gatsby 中插入自定义脚本 - Inserting a Custom Script in React Helmet/ Gatsby 将 react-helmet 添加到我的 Gatsby 项目中会导致错误:元素类型无效 - Adding react-helmet into my Gatsby project causes an error: Element type is invalid 无法使用 npm 安装 gatsby-plugin-transition-link - unable to install gatsby-plugin-transition-link with npm 无法在 gatsby 站点中安装和配置 MDX 转换器插件(和依赖项) - Unable to Install and configure the MDX transformer plugin (and dependencies) in gatsby site Gatsby 在 react-helmet 中嵌入带有脚本标签的表单 - Gatsby embed forms with script tag in react-helmet gatsby-react-helmet 生成空<title>在 SSR 上&lt;/div&gt;</title><div id="text_translate"><p> 我的 Gatsby 网站没有在 SSR 上生成正确的标题标签。 当我建立网站时,我在生成的文件上得到的只是&lt;title data-react-helmet="true"&gt;&lt;/title&gt; 。 我很感激帮助找到问题并解决,因为经过长时间的调试过程,我不知道哪个可能是问题。</p><p> 相关文件:</p><p> <strong>package.json</strong></p><pre> ... "dependencies": { "gatsby": "^2.19.45", "gatsby-image": "^2.2.44", "gatsby-plugin-manifest": "^2.2.48", "gatsby-plugin-react-helmet": "^3.2.2", "gatsby-plugin-sharp": "^2.4.13", "gatsby-plugin-sitemap": "^2.3.1", "gatsby-plugin-typescript": "^2.3.3", "gatsby-source-filesystem": "^2.1.56", "gatsby-source-graphql": "^2.2.0", "react": "^16.12.0", "react-dom": "^16.12.0", "react-helmet": "^6.0.0", }...</pre><p> <strong>gatsby.config.js</strong></p><pre> plugins: [ `gatsby-plugin-react-helmet`, ... ]</pre><p> <em>(gatsby-plugin-offline 已禁用)</em></p><p> 搜索引擎优化</p><pre>import React from "react" import { Helmet } from "react-helmet" import { useStaticQuery, graphql } from "gatsby" interface Props { title: string description?: string image?: string } const SEO = ({ title, description, image }: Props) =&gt; { const { site } = useStaticQuery( graphql` query { site { siteMetadata { title description image siteUrl } } } ` ) const metaDescription = description || site.siteMetadata.description const shareImage = image || site.siteMetadata.image const url = site.siteMetadata.siteUrl return ( &lt;Helmet defer={false}&gt; &lt;title&gt;{title}&lt;/title&gt; &lt;meta name="description" content={metaDescription} /&gt; &lt;meta name="image" content={shareImage} /&gt; &lt;link rel="canonical" href={url} /&gt; &lt;meta property="og:url" content={url} /&gt; &lt;meta property="og:type" content="website" /&gt; &lt;meta property="og:title" content={title} /&gt; &lt;meta property="og:description" content={metaDescription} /&gt; &lt;meta property="og:image" content={shareImage} /&gt; &lt;meta name="twitter:card" content="summary_large_image" /&gt; &lt;meta name="twitter:title" content={title} /&gt; &lt;meta name="twitter:description" content={metaDescription} /&gt; &lt;meta name="twitter:image" content={shareImage} /&gt; &lt;/Helmet&gt; ) } export default SEO</pre><p> 将&lt;title&gt;{title}&lt;/title&gt;更改为&lt;Helmet title={title}&gt;或删除defer={true}不会改变结果中的任何内容。</p><p> <strong>盖茨比-ssr.js</strong></p><pre> import React from "react" import { Helmet } from "react-helmet" export const onRenderBody = ( { setHeadComponents, setHtmlAttributes, setBodyAttributes }, pluginOptions ) =&gt; { const helmet = Helmet.renderStatic() setHtmlAttributes(helmet.htmlAttributes.toComponent()) setBodyAttributes(helmet.bodyAttributes.toComponent()) setHeadComponents([ helmet.title.toComponent(), helmet.link.toComponent(), helmet.meta.toComponent(), helmet.noscript.toComponent(), helmet.script.toComponent(), helmet.style.toComponent() ]) }</pre><p> <em>我仍然有一个空的 srr 文件的问题。</em></p><p> 在任何给定的页面上,我都会调用 SEO 标签,例如:</p><pre> &lt;SEO title="Hello World" description="Foo Bar" /&gt;</pre></div> - gatsby-react-helmet generating empty <title> on SSR 找不到自定义jQuery插件 - Unable to find custom jQuery plugin 使用 js 插件在 react/gatsby 组件中嵌入内容 - Using a js plugin to embed content in react/gatsby component
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM