TryGhost / gatsby-starter-ghost

A starter template to build lightning fast websites with Ghost & Gatsby
https://gatsby.ghost.org
MIT License
1.08k stars 875 forks source link

gatsby develop build fails with Invalid options object - Fresh Installation #428

Closed abhishc closed 2 years ago

abhishc commented 3 years ago

` ERROR

Invalid options object. Ignore Plugin has been initialized using an options object that does not match the API schema.

`

jansroka commented 3 years ago

+1 - same issue here (fresh install, OSX)

friskomayufid commented 3 years ago

+1 - same issue also for me on windows 10

henry-chiu-tech commented 3 years ago

Changed Gatsby version to 3.13.1 Does anyone get WEBPACK errors when they try to use gatsby develop ?

henry-chiu-tech commented 3 years ago

Changed Gatsby version to 3.13.1 Does anyone get WEBPACK errors when they try to use gatsby develop ?

Use webpack v4 by using"webpack": "^4.29.6" in dependencies.

ecda909 commented 2 years ago

+1 - same issue here (fresh install, OSX)

pstaylor-patrick commented 2 years ago

+1 same issue here on a 2021 Apple MacBook Pro (Apple Silicon) running:

 ERROR 

Invalid options object. Ignore Plugin has been initialized using an options object that does not match the API schema.
 - options should be one of these:
   object { resourceRegExp, contextRegExp? } | object { checkResource }
   Details:
    * options misses the property 'resourceRegExp'. Should be:
      RegExp
      -> A RegExp to test the request against.
    * options misses the property 'checkResource'. Should be:
      function
      -> A filter function for resource and context.

  ValidationError: Invalid options object. Ignore Plugin has been initialized using an options object that does not match the API 
  schema.
   - options should be one of these:
     object { resourceRegExp, contextRegExp? } | object { checkResource }
     Details:
      * options misses the property 'resourceRegExp'. Should be:
        RegExp
        -> A RegExp to test the request against.
      * options misses the property 'checkResource'. Should be:
        function
        -> A filter function for resource and context.

  - validate.js:105 validate
    [gatsby-starter-ghost]/[schema-utils]/dist/validate.js:105:11

  - create-schema-validation.js:16 
    [gatsby-starter-ghost]/[webpack]/lib/util/create-schema-validation.js:16:17

  - IgnorePlugin.js:28 new IgnorePlugin
    [gatsby-starter-ghost]/[webpack]/lib/IgnorePlugin.js:28:3

  - webpack-plugins.ts:16 Object.ignore
    [gatsby-starter-ghost]/[gatsby]/src/utils/webpack-plugins.ts:16:12

  - webpack-utils.ts:767 Object.moment
    [gatsby-starter-ghost]/[gatsby]/src/utils/webpack-utils.ts:767:13

  - webpack.config.js:211 getPlugins
    [gatsby-starter-ghost]/[gatsby]/src/utils/webpack.config.js:211:15

  - webpack.config.js:512 module.exports
    [gatsby-starter-ghost]/[gatsby]/src/utils/webpack.config.js:512:14

  - build-html.ts:180 buildRenderer
    [gatsby-starter-ghost]/[gatsby]/src/commands/build-html.ts:180:18

  - start-server.ts:118 createIndexHtml
    [gatsby-starter-ghost]/[gatsby]/src/utils/start-server.ts:118:32

  - start-server.ts:156 startServer
    [gatsby-starter-ghost]/[gatsby]/src/utils/start-server.ts:156:5

  - start-webpack-server.ts:44 startWebpackServer
    [gatsby-starter-ghost]/[gatsby]/src/services/start-webpack-server.ts:44:7

not finished Building development bundle - 0.053s
pstaylor-patrick commented 2 years ago

I created a pull request at https://github.com/TryGhost/gatsby-starter-ghost/pull/459 reflecting the combination of changes that worked for me.

I took both of @henry-chiu-tech 's recommendations from https://github.com/TryGhost/gatsby-starter-ghost/issues/428#issuecomment-962397694 and https://github.com/TryGhost/gatsby-starter-ghost/issues/428#issuecomment-962434183, and those, together, cleared the errors for me.

Changed Gatsby version to 3.13.1 ... Use webpack v4 by using"webpack": "^4.29.6" in dependencies.

NOTE that I put webpack in devDependencies rather than dependencies to minimize bundle size. That's a build tool, so I don't see any reason why it should be in dependencies.

douglaschu commented 2 years ago

+1 Same problem. @pstaylor-patrick's implementation of @henry-chiu-tech's additions to package.json didn't work, same error message.

andrews1022 commented 2 years ago

I encountered numerous bugs when trying to use this repo in it's current state, including the Invalid options object error this issue aims to address. Also, I prefer just sticking with npm, so I removed yarn.lock, and used package-lock.json.

First, when I ran npx gatsby new . https://github.com/TryGhost/gatsby-starter-ghost, I saw the following error:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: gatsby-starter-ghost@2.0.0
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR!   react@"17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.9.0" from @tryghost/helpers-gatsby@1.0.64
npm ERR! node_modules/@tryghost/helpers-gatsby
npm ERR!   @tryghost/helpers-gatsby@"1.0.64" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /home/andrew/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:

So, I changed the react and react-dom version numbers to 16.9.0. Then, I ran npm i again, and everything installed just fine.

After the packages were done downloading, I ran npm run dev to start up the local development server. I saw this error:

Invalid options object. Ignore Plugin has been initialized using an options object that does not match the API schema.
 - options should be one of these:
   object { resourceRegExp, contextRegExp? } | object { checkResource }
   Details:
    * options misses the property 'resourceRegExp'. Should be:
      RegExp
      -> A RegExp to test the request against.
    * options misses the property 'checkResource'. Should be:
      function
      -> A filter function for resource and context.

After a lot of trial and error, this comment saved the day.

So, I deleted node_modules folder and package-lock.json, and updated gatsby version from 3.12.1 to 3.13.1, then installed all npm packages again: npm i

When I ran npm run dev again, I saw this error:

ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

Can't resolve 'url' in '/home/andrew/Documents/web-dev/personal/gatsby/ghost-starter/src/components/common/meta'

If you're trying to use a package make sure that 'url' is installed. If you're trying to use a local file make sure that the path is correct.

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
    - add a fallback 'resolve.fallback: { "url": require.resolve("url/") }'
    - install 'url'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "url": false }

So, I simply installed the latest version of this url package: "url": "0.11.0"

For good measure, I added the gatsby clean script into scripts: "clean": "gatsby clean"

Then updated dev to: "dev": "npm run clean && gatsby develop"

Ran npm run dev, and FINALLY the site started up without issue

In the end, here is what my package.json file looks like:

{
  "name": "gatsby-starter-ghost",
  "description": "A starter template to build lightning fast websites with Ghost and Gatsby",
  "version": "2.0.0",
  "license": "MIT",
  "author": "Ghost Foundation",
  "homepage": "https://docs.ghost.org/api/gatsby/",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/tryghost/gatsby-starter-ghost.git"
  },
  "engines": {
    "node": ">= 12.13.0"
  },
  "bugs": {
    "url": "https://github.com/tryghost/gatsby-starter-ghost/issues"
  },
  "keywords": [
    "gatsby",
    "ghost"
  ],
  "main": "n/a",
  "scripts": {
    "clean": "gatsby clean",
    "serve": "gatsby build && NODE_ENV=production gatsby serve",
    "build": "gatsby build",
    "dev": "npm run clean && gatsby develop",
    "lint": "eslint . --ext .js --cache",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "devDependencies": {
    "babel-eslint": "10.1.0",
    "eslint": "8.9.0",
    "eslint-plugin-ghost": "2.13.0",
    "eslint-plugin-react": "7.28.0"
  },
  "dependencies": {
    "@tryghost/helpers": "1.1.57",
    "@tryghost/helpers-gatsby": "1.0.64",
    "cheerio": "1.0.0-rc.10",
    "gatsby": "3.13.1",
    "gatsby-awesome-pagination": "0.3.8",
    "gatsby-image": "3.11.0",
    "gatsby-plugin-advanced-sitemap": "2.0.0",
    "gatsby-plugin-catch-links": "3.12.0",
    "gatsby-plugin-feed": "3.12.0",
    "gatsby-plugin-force-trailing-slashes": "1.0.5",
    "gatsby-plugin-manifest": "3.12.0",
    "gatsby-plugin-offline": "4.12.0",
    "gatsby-plugin-react-helmet": "4.12.0",
    "gatsby-plugin-sharp": "3.12.0",
    "gatsby-source-filesystem": "3.12.0",
    "gatsby-source-ghost": "4.2.4",
    "gatsby-transformer-sharp": "3.12.0",
    "lodash": "4.17.21",
    "react": "16.9.0",
    "react-dom": "16.9.0",
    "react-helmet": "6.1.0",
    "url": "0.11.0"
  }
}
aileen commented 2 years ago

Should be fixed with #510