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

Next build doesn't seem to be waiting for async results #8

Open
EricWVGG opened this issue Aug 4, 2023 · 5 comments
Open

Next build doesn't seem to be waiting for async results #8

EricWVGG opened this issue Aug 4, 2023 · 5 comments

Comments

@EricWVGG
Copy link

EricWVGG commented Aug 4, 2023

I'm seeing some problems in the build phase of our app that uses this lib. Everything runs fine in dev mode, but during the compile phase it spews some errors, and build isn't getting the "common props" at all.

I've set up my config like this…

module.exports = function () {
  const queries = {
    '/index': [
      {
        key: 'menu',
        data: async () => {
          console.log('init')
          const data = await sanityClient.fetch(menuQuery, { slug: 'overflow' })
          console.log('retrieved')
          return data
        },
      },
    ]
  }
  return queries
}

… and in the consumer component…

  const { common } = useCommonProps()
  if (!common['menu']) {
    throw new Error(`useCommonProps cannot find 'menu'`)
  }

When I run yarn dev, my terminal outputs something like this…

$ next dev
- ready started server on 0.0.0.0:3000, url: http://localhost:3000
- info Loaded env from /Users/wvgg/Sites/boutique-homes/charlie/apps/consumer/.env
- event compiled client and server successfully in 107 ms (18 modules)
- wait compiling...
- event compiled client and server successfully in 74 ms (18 modules)
- wait compiling /_error (client and server)...
- event compiled client and server successfully in 1700 ms (458 modules)
Error: useCommonProps cannot find 'menu'
    at OverflowMenu (webpack-internal:///./src/components/overflowMenu/index.tsx:42:97)
    at renderWithHooks (/Users/wvgg/Sites/boutique-homes/charlie/node_modules/react-dom/cjs/react-dom-server.browser.development.js:5658:16)
// BIG LONG STACK TRACE
- warn Fast Refresh had to perform a full reload. Read more: https://nextjs.org/docs/messages/fast-refresh-reload
- wait compiling / (client and server)...
- event compiled client and server successfully in 1332 ms (912 modules)
init
retrieved

Similar results on yarn build, except I never even see retrieved.

My best guess is that NextJS (13.4.9) is plowing forward with the build before the promises in the config are fulfilled — possibly a new release optimization doesn't play well with the package?

Any advice or insight you could offer would be greatly appreciated.

[addendum: this code has been working fine since April; then this glitch showed up about one month ago.]

@thuatz
Copy link

thuatz commented Aug 25, 2023

why do you need const queries = , just return the value

@EricWVGG
Copy link
Author

I just threw that together a quick example for clarity.

@thuatz
Copy link

thuatz commented Aug 26, 2023

ah, looks like the issue came from /_error page
you can see the define of "menu" is for '/index' page only, so it only available for the index page.
Change index to 'app' (or _app, base on your code structure) should resolve the issue.

@EricWVGG
Copy link
Author

… could have sworn that it was… hm…

Unfortunately we've already moved on to dumping the lib and doing the query on every page (ugh), it was a pretty huge refactor so I'm not eager to undo it.

So silly that NextJS hasn't had this all along, I truly don't get why it has such a better rep than Gatsby. This is basic functionality.

@thuatz
Copy link

thuatz commented Aug 28, 2023

They acknowledged the problem, so they support this function in their new app layout, you can take a look here:
vercel/next.js#16684

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

No branches or pull requests

2 participants