Гэтсби: «Не удается прочитать свойство» разделение «неопределенного» при развертывании в netlify

#webpack #gatsby #netlify

Вопрос:

У меня есть проект «Гэтсби», который я привык развертывать без проблем, пока не появился новый v3. Теперь, когда я использую Netlify для развертывания, я получаю эту ошибку, которую я не получаю в режиме разработки.

 Cannot read property 'split' of undefined
 

У меня нет файлов с разделением в нем. Я только недавно полностью обновил и исправил свой веб-сайт в связи с критическими изменениями.

пакет.json:

 {
  "name": "menefex",
  "private": true,
  "description": "Wij bouwen websites amp; webapps bouwen met oog voor detail.",
  "version": "1.8.7",
  "engines": {
    "node": ">=8.0.0"
  },
  "author": "Michael Fransman <mikeyfe6@menefex.nl>",
  "license": "agpl-3.0",
  "scripts": {
    "build": "gatsby clean amp;amp; gatsby build",
    "develop": "GATSBY_GRAPHQL_IDE=playground gatsby develop -H 0.0.0.0 --open",
    "format": "prettier --write "**/*.{js,jsx,json,md}"",
    "eslint-check": "eslint --print-config .eslintrc | eslint-config-prettier-check",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "test": "echo "Write tests! -> https://gatsby.dev/unit-testing ""
  },
  "dependencies": {
    "@contentful/rich-text-html-renderer": "^15.2.0",
    "@contentful/rich-text-types": "^15.1.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.36",
    "@fortawesome/free-brands-svg-icons": "^5.15.4",
    "@fortawesome/free-regular-svg-icons": "^5.15.4",
    "@fortawesome/free-solid-svg-icons": "^5.15.4",
    "@fortawesome/react-fontawesome": "^0.1.15",
    "@sendgrid/mail": "^7.4.6",
    "axios": "^0.21.1",
    "bootstrap": "^5.1.0",
    "css-minimizer-webpack-plugin": "^3.0.2",
    "dotenv": "^10.0.0",
    "gatsby": "^3.12.0",
    "gatsby-plugin-canonical-urls": "^3.12.0",
    "gatsby-plugin-catch-links": "^3.12.0",
    "gatsby-plugin-disqus": "^1.2.2",
    "gatsby-plugin-feed": "^3.12.0",
    "gatsby-plugin-google-tagmanager": "^3.12.0",
    "gatsby-plugin-image": "^1.12.0",
    "gatsby-plugin-manifest": "^3.12.0",
    "gatsby-plugin-netlify": "^3.12.0",
    "gatsby-plugin-nprogress": "^3.12.0",
    "gatsby-plugin-offline": "^4.12.0",
    "gatsby-plugin-react-helmet": "^4.12.0",
    "gatsby-plugin-robots-txt": "^1.6.9",
    "gatsby-plugin-sass": "^4.12.0",
    "gatsby-plugin-sharp": "^3.12.0",
    "gatsby-plugin-sitemap": "^4.8.0",
    "gatsby-plugin-smoothscroll": "^1.2.0",
    "gatsby-remark-images": "^5.9.0",
    "gatsby-remark-images-contentful": "^4.9.0",
    "gatsby-remark-relative-images": "^2.0.2",
    "gatsby-source-contentful": "^5.12.0",
    "gatsby-source-filesystem": "^3.12.0",
    "gatsby-transformer-remark": "^4.9.0",
    "gatsby-transformer-sharp": "^3.12.0",
    "google-map-react": "^2.1.10",
    "netlify-lambda": "^2.0.14",
    "prop-types": "^15.7.2",
    "react": "^17.0.2",
    "react-animate-on-scroll": "^2.1.5",
    "react-animated-css": "^1.2.1",
    "react-bootstrap": "^1.6.1",
    "react-cookie-consent": "^6.3.0",
    "react-dom": "^17.0.2",
    "react-helmet": "^6.1.0",
    "sass": "^1.38.0",
    "smooth-scroll": "^16.1.3",
    "swiper": "^6.8.2"
  },
  "devDependencies": {
    "@babel/core": "^7.15.0",
    "@babel/eslint-parser": "^7.15.0",
    "babel-preset-gatsby": "^1.12.0",
    "eslint": "^7.32.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-config-react-app": "^6.0.0",
    "eslint-plugin-import": "^2.24.0",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-react": "^7.24.0",
    "eslint-plugin-react-hooks": "^4.2.0",
    "eslint-webpack-plugin": "^3.0.1",
    "gatsby-plugin-eslint": "^3.0.0",
    "prettier": "^2.3.2"
  },
  "resolutions": {
    "graphql": "^15.4.0",
    "graphql-compose": "^7.25.0",
    "contentful": "^8.1.7",
    "webpack": "^5.24.2",
    "postcss": "^8.2.15"
  },
  "homepage": "https://menefex.nl",
  "keywords": [
    "menefex"
  ],
  "repository": {
    "type": "git",
    "url": "https://github.com/mikeyfe6/menefex"
  },
  "bugs": {
    "url": "https://github.com/gatsbyjs/gatsby/issues"
  }
}
 

Вероятно, это проблема с веб-пакетом, поскольку gatsby build amp;amp; gatsby serve приводит к следующему:

введите описание изображения здесь

Ответ №1:

Это, конечно, не проблема GraphQL. Вы можете воссоздать проблему, создав производственную сборку репозитория Gatsby в вашей локальной среде с gatsby build --verbose помощью .

Как только вы выполните подробную сборку, вы увидите, что ошибка вызвана конфигурацией веб-пакета Gatsby. Прямо сейчас исправление, предоставленное сопровождающими Gatsby, состоит в том, чтобы просто исправить пакеты npm i -D gatsby@3.4.0-webpack-split-fix.8 . Вам не должно понадобиться это исправление в следующем выпуске второстепенной версии «Гэтсби».