gatsby develop command error: TypeError: Cannot read property 'options' of undefined

[trkaplan]

Description

I'm following the steps at Quick Start document to start a gatsby project. But gasby develop command gives this error:
I've tried these but didn't work.;

• removing .cache, node_modulesthen running npm install,
• removing .cache, node_modules, package-lock.json then running npm install,
• removing .cache, node_modules, package-lock.json, yarn.lockthen running npm install,

...
info bootstrap finished - 4.22 s

here ./.cache/develop-static-entry.js
Module build failed (from ./node_modules/gatsby/dist/utils/babel-loader.js):
TypeError: Cannot read property 'options' of undefined
    at getCustomOptions (/Users/mymac/WebApps/app1/gatsby-site/node_modules/gatsby/dist/utils/babel-loader-helpers.js:27:42)
    at Object.customOptions (/Users/mymac/WebApps/app1/gatsby-site/node_modules/gatsby/dist/utils/babel-loader.js:34:12)
    at Object.<anonymous> (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:91:52)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:3:103)
    at _next (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:5:194)
    at /Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:5:364
    at Promise._execute (/Users/mymac/.nvm/versions/node/v11.9.0/lib/node_modules/gatsby-cli/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/mymac/.nvm/versions/node/v11.9.0/lib/node_modules/gatsby-cli/node_modules/bluebird/js/release/promise.js:483:18)
    at new Promise (/Users/mymac/.nvm/versions/node/v11.9.0/lib/node_modules/gatsby-cli/node_modules/bluebird/js/release/promise.js:79:10)
    at Object.<anonymous> (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:5:97)
    at Object._loader (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:220:18)
    at Object.loader (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:56:18)
    at Object.<anonymous> (/Users/mymac/WebApps/app1/gatsby-site/node_modules/babel-loader/lib/index.js:51:12)
error There was an error compiling the html.js component for the development server.

See our docs page on debugging HTML builds for help https://gatsby.app/debug-html

  14 |              l: false,
  15 |              exports: {}
> 16 |          };
     | ^
  17 | 
  18 |          // Execute the module function
  19 |          modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);


  WebpackError: ./.cache/develop-static-entry.js

  - bootstrap:16 getCustomOptions
    lib/webpack/bootstrap:16:1




  - universalModuleDefinition:3 asyncGeneratorStep
    lib/webpack/universalModuleDefinition:3:1

  - universalModuleDefinition:5 _next
    lib/webpack/universalModuleDefinition:5:1

  - universalModuleDefinition:5 
    lib/webpack/universalModuleDefinition:5:1



  - bootstrap:68 new Promise
    lib/webpack/bootstrap:68:1

  - universalModuleDefinition:5 Object.<anonymous>
    lib/webpack/universalModuleDefinition:5:1


  - bootstrap:45 Object.loader
    lib/webpack/bootstrap:45:1

  - bootstrap:40 Object.<anonymous>
    lib/webpack/bootstrap:40:1

Steps to reproduce

Run these commands:

npm install --global gatsby-cli
gatsby new gatsby-site
cd gatsby-site
gatsby develop

Expected result

Gatsby development server should start without any error.

Actual result

Gatsby development server does not start and gives error.

Environment

  System:
    OS: macOS High Sierra 10.13.6
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 11.9.0 - ~/.nvm/versions/node/v11.9.0/bin/node
    Yarn: 1.13.0 - /usr/local/bin/yarn
    npm: 6.7.0 - ~/.nvm/versions/node/v11.9.0/bin/npm
  Languages:
    Python: 2.7.10 - /usr/bin/python
  Browsers:
    Chrome: 71.0.3578.98
    Firefox: 57.0.4
    Safari: 12.0.2
  npmPackages:
    gatsby: ^2.0.117 => 2.0.117 
    gatsby-image: ^2.0.29 => 2.0.29 
    gatsby-plugin-manifest: ^2.0.17 => 2.0.17 
    gatsby-plugin-offline: ^2.0.23 => 2.0.23 
    gatsby-plugin-react-helmet: ^3.0.6 => 3.0.6 
    gatsby-plugin-sharp: ^2.0.20 => 2.0.20 
    gatsby-source-filesystem: ^2.0.20 => 2.0.20 
    gatsby-transformer-sharp: ^2.1.13 => 2.1.13 
  npmGlobalPackages:
    gatsby-cli: 2.4.9

Additional Notes

I got a feedback from @ghardin137 He does not get any errors with this configuration, so I downgraded npm version to 6.5.0 and then tried again but no luck.

  System:
    OS: macOS 10.14
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 11.9.0 - ~/.nvm/versions/node/v11.9.0/bin/node
    Yarn: 1.6.0 - ~/.yarn/bin/yarn
    npm: 6.5.0 - ~/.nvm/versions/node/v11.9.0/bin/npm
  Languages:
    Python: 2.7.10 - /usr/bin/python
  Browsers:
    Chrome: 71.0.3578.98
    Firefox: 65.0
    Safari: 12.0
  npmPackages:
    gatsby: ^2.0.117 => 2.0.117
    gatsby-image: ^2.0.29 => 2.0.29
    gatsby-plugin-manifest: ^2.0.17 => 2.0.17
    gatsby-plugin-offline: ^2.0.23 => 2.0.23
    gatsby-plugin-react-helmet: ^3.0.6 => 3.0.6
    gatsby-plugin-sharp: ^2.0.20 => 2.0.20
    gatsby-source-filesystem: ^2.0.20 => 2.0.20
    gatsby-transformer-sharp: ^2.1.13 => 2.1.13
  npmGlobalPackages:
    gatsby-cli: 2.4.9

[dvonlehman]

This is the same thing I have reported in https://github.com/gatsbyjs/gatsby/issues/11599. At least it's not just me.

[sidharthachatterjee]

Sorry you're seeing this @trkaplan

I can't seem to reproduce this locally. Can you try deleting the the public directory as well along with .cache?

If you're able to consistently reproduce this on your project, can you link to a minimal reproduction?

[jonniebigodes]

@dvonlehman and @trkaplan just tried it on windows 10 and wls running ubuntu 18.04 and i could not replicate it on either as you can see bellow, this is a plain new gatsby site based on the default starter, nothing else attached to them:
Left side is windows 10 output, right side wsl output of gatsby develop, ports in the right side is different because the wsl took precedence.

The only difference i can see at first glance is the the npm and node versions.
Running on npm version 6.4.1 and node 10.13.0

[trkaplan]

Thanks for your reply @dvonlehman but I'm not on windows, I'm on macOS.
@dvonlehman could you please run npx gatsby info --clipboard and add the output to your issue?

[dvonlehman]

I'm on OSX also. I just followed the same getting started steps as you and got the same error. Here is the output of npx gatsby info:

  System:
    OS: macOS High Sierra 10.13.1
    CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.13.0 - ~/.nvm/versions/node/v10.13.0/bin/node
    Yarn: 1.13.0 - ~/.yarn/bin/yarn
    npm: 6.7.0 - ~/.nvm/versions/node/v10.13.0/bin/npm
  Languages:
    Python: 2.7.15 - /usr/local/bin/python
  Browsers:
    Chrome: 71.0.3578.98
    Firefox: 64.0
    Safari: 11.0.1
  npmPackages:
    gatsby: ^2.0.118 => 2.0.118 
    gatsby-image: ^2.0.29 => 2.0.29 
    gatsby-plugin-manifest: ^2.0.17 => 2.0.17 
    gatsby-plugin-offline: ^2.0.23 => 2.0.23 
    gatsby-plugin-react-helmet: ^3.0.6 => 3.0.6 
    gatsby-plugin-sharp: ^2.0.20 => 2.0.20 
    gatsby-source-filesystem: ^2.0.20 => 2.0.20 
    gatsby-transformer-sharp: ^2.1.13 => 2.1.13 
  npmGlobalPackages:
    gatsby-cli: 2.4.9
    gatsby: 2.0.93

Perhaps the npm version is to blame? I just recently updated.

UPDATE:

I used nvm to switch to node 8.10 and npm 6.4 but I still get the same error. I deleted node_modules, public, and .cache before running npm install && npm start.

[trkaplan]

Thanks for your reply @sidharthachatterjee I've tried removing .cache and public and tried again but no luck. I can give you access to my desktop, if you want to try/check some other thing.

Sorry you're seeing this @trkaplan

I can't seem to reproduce this locally. Can you try deleting the the public directory as well along with .cache?

If you're able to consistently reproduce this on your project, can you link to a minimal reproduction?

[pieh]

So we finally managed to reproduce the issue thanks to @trkaplan. Problem in this case seemed to be that NODE_ENV was globally set to test (system-wide) and gatsby doesn't handle that case well now.

@dvonlehman can you try running NODE_ENV=development gatsby develop / NODE_ENV=production gatsby build (if you are on Linux or Mac, for Windows is a bit more difficult but doable - just let me know and I will provide more details).

[dvonlehman]

@pieh that did the trick! Thank you for the follow-up.

[DSchau]

Going to close this as answered--nice debugging @pieh!

Please re-open or comment if we missed something or can help further, thank you!

[peterwiebe]

I was having this problem when trying to _deploy_ to Netlify.

I personally use npm when developing but when the Netlify runs the build command it uses Yarn. I didn't delete the yarn.lock file and so the build command was using an out of date yarn.lock instead of the package-lock.json. I deleted it and it was able to build correctly.

[jbryan11]

So we finally managed to reproduce the issue thanks to @trkaplan. Problem in this case seemed to be that NODE_ENV was globally set to test (system-wide) and gatsby doesn't handle that case well now.

@dvonlehman can you try running NODE_ENV=development gatsby develop / NODE_ENV=production gatsby build (if you are on Linux or Mac, for Windows is a bit more difficult but doable - just let me know and I will provide more details).

I followed this setup: Setting up gatsby site without using 'gatsby new'

and tried the script with cross-env, cross-env NODE_ENV=development gatsby develop, the problem still persists.

I tried the following:

• removing .cache and public then run gatsby develop
• removing .cache, public, and node_modules then npm install and run gatsby develop
• removing .cache, public, and node_modules then npm install and run cross-env NODE_ENV=development gatsby develop

NPM Error Log @ .../npm-cache/_logs directory

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Users\\johnbryan.MaxIDea.000\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'dev'
1 verbose cli ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predev', 'dev', 'postdev' ]
5 info lifecycle [email protected]~predev: [email protected]
6 info lifecycle [email protected]~dev: [email protected]
7 verbose lifecycle [email protected]~dev: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~dev: PATH: C:\Users\johnbryan.MaxIDea.000\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\johnbryan.MaxIDea.000\Documents\[P]WEBSITE PROJECT\vacuum-labs\node_modules\.bin;C:\Program Files (x86)\python\;C:\Program Files (x86)\python\Scripts;C:\Windows\System32;C:\python\;C:\python\Scripts;C:\WinAVR-20100110\bin;C:\WinAVR-20100110\utils\bin;C:\Program Files (x86)\Microsoft SDKs\VSTS\CLI\wbin;C:\Program Files (x86)\Common Files\Intel\Shared Files\cpp\bin\Intel64;C:\Program Files (x86)\Common Files\Intel\Shared Libraries\redist\intel64\compiler;C:\Program Files\Java\jre1.8.0_121\bin;C:\Program Files(x86)\MySQL\MySQL Server 5.7\bin;C:\Program Files\Git\cmd;C:\Program Files\Microsoft\Web Platform Installer\;C:\Program Files\dotnet\;C:\APKTOOL\;C:\Program Files\nodejs\;C:\Program Files\Microsoft VS Code\bin;C:\Program Files\PowerShell\7\;C:\ProgramData\chocolatey\bin;C:\Program Files (x86)\Scripts\;C:\Program Files (x86)\;C:\Users\johnbryan.MaxIDea.000\AppData\Local\Programs\AdoptOpenJDK\bin;C:\Program Files\php;C:\Program Files\nodejs;C:\Program Files(x86)\Gradle\gradle-4.4-all\gradle-4.4\bin;C:\Users\johnbryan.MaxIDea.000\.dotnet\tools;;C:\Python27;C:\Python27\Scripts;C:\Program Files\MATLAB\R2017a\bin;C:\Users\johnbryan.MaxIDea.000\AppData\Roaming\npm;C:\Program Files (x86)\GitHub CLI\
9 verbose lifecycle [email protected]~dev: CWD: C:\Users\johnbryan.MaxIDea.000\Documents\[P]WEBSITE PROJECT\vacuum-labs
10 silly lifecycle [email protected]~dev: Args: [ '/d /s /c', 'cross-env NODE_ENV=development gatsby develop' ]
11 silly lifecycle [email protected]~dev: Returned: code: 1  signal: null
12 info lifecycle [email protected]~dev: Failed to exec dev script
13 verbose stack Error: [email protected] dev: `cross-env NODE_ENV=development gatsby develop`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (C:\Users\johnbryan.MaxIDea.000\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:210:5)
13 verbose stack     at ChildProcess.<anonymous> (C:\Users\johnbryan.MaxIDea.000\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:210:5)
13 verbose stack     at maybeClose (internal/child_process.js:1021:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:283:5)
14 verbose pkgid [email protected]
15 verbose cwd C:\Users\johnbryan.MaxIDea.000\Documents\[P]WEBSITE PROJECT\vacuum-labs
16 verbose Windows_NT 6.3.9600
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\johnbryan.MaxIDea.000\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "dev"
18 verbose node v12.13.1
19 verbose npm  v6.14.9
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] dev: `cross-env NODE_ENV=development gatsby develop`
22 error Exit status 1
23 error Failed at the [email protected] dev script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

My Environment Specs
npm: 6.14.9
node: 12.13.1.
Windows_version: 8.1
Python: 3.8.0