Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Storybook to work with Next 11 #393

Merged
merged 2 commits into from
Aug 19, 2021
Merged

Conversation

kalvinwang
Copy link
Contributor

@kalvinwang kalvinwang commented Aug 18, 2021

Update Storybook to work with the recent changes in #390

All changes are the result of following the docs for 3.0 located at https://storybook.js.org/addons/storybook-addon-next-router, and removing 1.x/2.x-specific changes

I checked every component in Storybook sidebar to ensure that it's working

===

  • Relevent Documentation (e.g. READMEs, Technical Foundation) updated
  • Issue AC are copied to this PR & are met
  • Changes are tested on Staging post-merge into main

Copy link
Contributor

@rocketnova rocketnova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code in this PR looks good, but I've found another artifact from #390. After #390, yarn build is providing slightly different info.

Before:

$ next build
(node:45901) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at <snip>ui-claim-tracker/node_modules/next/node_modules/postcss/package.json.
Update this package.json to use a subpath pattern like "./*".
(Use `node --trace-deprecation ...` to show where the warning was created)
info  - Loaded env from <snip>/.env.local
info  - Using external babel configuration from <snip>/ui-claim-tracker/.babelrc
info  - Creating an optimized production build
info  - Compiled successfully
info  - Collecting page data
info  - Generating static pages (6/6)
info  - Finalizing page optimization
<snip>

After/Now:

$ next build
info  - Loaded env from <snip>/ui-claim-tracker/.env.local
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
info  - Checking validity of types
warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
info  - Using external babel configuration from <snip>/ui-claim-tracker/.babelrc
info  - Creating an optimized production build
info  - Compiled successfully
info  - Collecting page data
info  - Generating static pages (6/6)
info  - Finalizing page optimization
<snip>
  1. Is there a way to resolve the Next.js plugin warning?
  2. Are we expecting to use webpack 5?

@kalvinwang
Copy link
Contributor Author

kalvinwang commented Aug 18, 2021

  1. Thanks for catching! Not that I can figure out quickly, but I've created a ticket. The warning is a little misleading, it's indicating that there's a new enhancement in Next 11 we haven't integrated yet, not that there's a regression.
  2. Yup! It's part of the benefit of updating. Also we're still using webpack 4 for storybook.

Copy link
Contributor

@rocketnova rocketnova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for answering my questions. LGTM!

@kalvinwang kalvinwang merged commit f9e28e3 into main Aug 19, 2021
@kalvinwang kalvinwang deleted the kalvin-fix-storybook branch August 19, 2021 21:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants