gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.28k stars 10.31k forks source link

`develop` and `build` scripts fail with `Cannot read properties of undefined (reading 'tap')` #37707

Closed darktasevski closed 1 year ago

darktasevski commented 1 year ago

Preliminary Checks

Description

There seems to be a problem with the DefinePlugin. I've looked through the Gatsby code a bit but couldn't pinpoint the issue. When I run the scripts without this file or without the DefinePlugin it works fine.

import packageJson from './package.json';

import type { GatsbyNode, PackageJson } from 'gatsby';

export const onCreateWebpackConfig: GatsbyNode['onCreateWebpackConfig'] = ({
    actions,
    plugins,
}) => {
    actions.setWebpackConfig({
        resolve: {
            plugins: [
                plugins.define({
                    __NAME__: JSON.stringify(packageJson.name),
                    __VERSION__: JSON.stringify(packageJson.version),
                    __DESC__: JSON.stringify(packageJson.description),
                }),
            ],
        },
    });
};

Reproduction Link

https://github.com/darktasevski/gatsby-repro-repo

Steps to Reproduce

  1. clone the repo
  2. install the deps
  3. run any of these scripts: develop, start, build
  4. Observe that script fails with an error
Error details ERROR UNKNOWN Cannot read properties of undefined (reading 'tap') TypeError: Cannot read properties of undefined (reading 'tap') - DefinePlugin.js:280 DefinePlugin.apply [gatsby-starter-minimal-ts]/[webpack]/lib/DefinePlugin.js:280:30 - ResolverFactory.js:651 Object.exports.createResolver [gatsby-starter-minimal-ts]/[enhanced-resolve]/lib/ResolverFactory.js:651:11 - ResolverFactory.js:131 ResolverFactory._create [gatsby-starter-minimal-ts]/[webpack]/lib/ResolverFactory.js:131:12 - ResolverFactory.js:112 ResolverFactory.get [gatsby-starter-minimal-ts]/[webpack]/lib/ResolverFactory.js:112:28 - NormalModuleFactory.js:1114 NormalModuleFactory.getResolver [gatsby-starter-minimal-ts]/[webpack]/lib/NormalModuleFactory.js:1114:31 - NormalModuleFactory.js:653 defaultResolve [gatsby-starter-minimal-ts]/[webpack]/lib/NormalModuleFactory.js:653:35 - NormalModuleFactory.js:722 [gatsby-starter-minimal-ts]/[webpack]/lib/NormalModuleFactory.js:722:10 - Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync] [gatsby-starter-minimal-ts]/[tapable]/lib/Hook.js:18:14 - NormalModuleFactory.js:269 [gatsby-starter-minimal-ts]/[webpack]/lib/NormalModuleFactory.js:269:24 - ExternalModuleFactoryPlugin.js:146 next [gatsby-starter-minimal-ts]/[webpack]/lib/ExternalModuleFactoryPlugin.js:146:43 - ExternalModuleFactoryPlugin.js:152 handleExternals [gatsby-starter-minimal-ts]/[webpack]/lib/ExternalModuleFactoryPlugin.js:152:7 - ExternalModuleFactoryPlugin.js:249 [gatsby-starter-minimal-ts]/[webpack]/lib/ExternalModuleFactoryPlugin.js:249:5

I'm able to reproduce this with both Ts and non-Ts setups.

Expected Result

The scripts run without errors.

Actual Result

develop, start, build scripts are crashing.

Environment

System:
    OS: macOS 13.1
    CPU: (10) arm64 Apple M1 Pro
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.12.0 - ~/.n/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.19.2 - ~/.n/bin/npm
  Browsers:
    Chrome: 110.0.5481.177
    Safari: 16.2
  npmPackages:
    gatsby: ^5.7.0 => 5.7.0

Config Flags

No response

pieh commented 1 year ago

define plugins are not resolve plugins - they are top level webpack plugins - https://github.com/darktasevski/gatsby-repro-repo/pull/1 fixes the problem in your onCreateWebpackConfig

darktasevski commented 1 year ago

Damn, I'm blind. Thank you, @pieh!