Skip to content
This repository was archived by the owner on Apr 26, 2024. It is now read-only.

upgrading gatsby and gatsby plugins - #1166

Closed
benhalverson wants to merge 12 commits into
nodejs:masterfrom
benhalverson:gatsby-upgrade
Closed

upgrading gatsby and gatsby plugins#1166
benhalverson wants to merge 12 commits into
nodejs:masterfrom
benhalverson:gatsby-upgrade

Conversation

@benhalverson

@benhalverson benhalverson commented Mar 19, 2021

Copy link
Copy Markdown
Member

Description

Upgrading gatsby and gatsby related plugins

We need to figure out the build errors before this can be merged.

Related Issues

#1158

@benhalverson benhalverson added the create-preview Generate preview on staging.nodejs.dev label Mar 19, 2021
@github-actions github-actions Bot removed the create-preview Generate preview on staging.nodejs.dev label Mar 19, 2021
@github-actions

github-actions Bot commented Mar 19, 2021

Copy link
Copy Markdown

Please find a preview at: https://staging.nodejs.dev/1166/

@manishprivet

manishprivet commented Mar 21, 2021

Copy link
Copy Markdown
Member

Question: Instead of manually updating the versions, can we enable Dependabot in the repo for automatic version updates?

@benhalverson

benhalverson commented Mar 21, 2021

Copy link
Copy Markdown
Member Author

I think we have it already but only for security updates. When it was on for anything it was pretty noisy with the updates almost daily.

The errors that I'm seeing are in dev mode related to webpack and our darkmode controller package.

@benhalverson

benhalverson commented Mar 22, 2021

Copy link
Copy Markdown
Member Author

The error i get locally is


 ERROR

(node:38492) [DEP_WEBPACK_MAIN_TEMPLATE_OUTPUT_OPTIONS] DeprecationWarning: MainTemplate.outputOptions is deprecated (use Compilation.outputOptions instead)
(Use `node --trace-deprecation ...` to show where the warning was created)


 ERROR

(node:38492) [DEP_WEBPACK_MAIN_TEMPLATE_REQUIRE] DeprecationWarning: MainTemplate.hooks.require is deprecated (use
JavascriptModulesPlugin.getCompilationHooks().renderRequire instead)


 ERROR

(node:38492) [DEP_WEBPACK_COMPILATION_NORMAL_MODULE_LOADER_HOOK] DeprecationWarning: Compilation.hooks.normalModuleLoader was moved to
NormalModule.getCompilationHooks(compilation).loader

⠸ Building development bundle
/Users/benhalverson/projects/nodejs.dev/node_modules/yoga-layout-prebuilt/yoga-layout/build/Release/nbind.js:53
        throw ex;
        ^

Error: NormalModuleFactory.afterResolve (ReactRefreshPlugin) is no longer a waterfall hook, but a bailing hook instead. Do not return the passed object, but modify it instead. Returning false will ignore the request and results in no module created.
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:291:14
    at Hook.eval [as callAsync] (eval at create (/Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/tapable/lib/Hook.js:18:14)
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:287:30
    at eval (eval at create (/Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:532:7
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:117:11
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:564:8
    at NormalModuleFactory.resolveRequestArray (/Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:915:34)
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:556:11
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:117:11
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:636:8
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/webpack/lib/NormalModuleFactory.js:786:5
    at finishResolved (/Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/enhanced-resolve/lib/Resolver.js:278:11)
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/enhanced-resolve/lib/Resolver.js:342:25
    at /Users/benhalverson/projects/nodejs.dev/node_modules/gatsby/node_modules/enhanced-resolve/lib/Resolver.js:409:24
npm ERR! code ELIFECYCLE
npm ERR! errno 7
npm ERR! nodejs-website@0.3.0 start: `gatsby develop`
npm ERR! Exit status 7

@benhalverson

benhalverson commented Mar 22, 2021

Copy link
Copy Markdown
Member Author

I did npm ls webpack and found that storybook is using 4.x but gatsby requires webpack 5. The workaround for now is to use yarn 😢
storybookjs/storybook#14273

@mikeesto

mikeesto commented Mar 24, 2021

Copy link
Copy Markdown
Member

I did npm ls webpack and found that storybook is using 4.x but gatsby requires webpack 5. The workaround for now is to use yarn 😢
storybookjs/storybook#14273

: ( If we can upgrade to 6.2 of storybook when it lands, then it seems possible to configure it to use webpack 5: storybookjs/storybook#14170 (comment)

@benhalverson

benhalverson commented Mar 24, 2021

Copy link
Copy Markdown
Member Author

Ya that works for me we can also try that beta. Wanna do a PR for the storybook change @mikeesto

@benhalverson

benhalverson commented Mar 24, 2021

Copy link
Copy Markdown
Member Author

The other thing we need to figure out is why our darkmode controller throws an undefined error. You can see in the first few commits in this PR I had to comment it out.

@mikeesto

mikeesto commented Mar 25, 2021

Copy link
Copy Markdown
Member

@benhalverson I didn't have much luck with this, unfortunately. Storybook v6.2 is opt in to webpack 5 via an additional package - so npm ls webpack still shows up as v4 - and we end up in the same situation with both v4 and v5. I guess that's why yarn's version resolution is the current answer

@benhalverson

benhalverson commented Mar 25, 2021

Copy link
Copy Markdown
Member Author

@mikeesto have you seen this migration guide gist? It looks like it was just posted a few hours ago. https://gist.github.com/shilman/8856ea1786dcd247139b47b270912324
What is the additonal package?

@mikeesto mikeesto mentioned this pull request Mar 26, 2021
Merged
@mikeesto

mikeesto commented Mar 26, 2021

Copy link
Copy Markdown
Member

@benhalverson Thanks. That link is useful but still some problems to work through. I've set up a draft PR so hopefully some more eyes on it: #1178 . Possible I have done something dumb

@lancemccluskey lancemccluskey mentioned this pull request Apr 8, 2021
Merged
@benhalverson benhalverson mentioned this pull request Apr 17, 2021
Merged
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@benhalverson @manishprivet @mikeesto @abhishekdubey1