v13 Server Components - Webpack error running data fetching method

[jens-ox]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 21.6.0: Wed Aug 10 14:28:35 PDT 2022; root:xnu-8020.141.5~2/RELEASE_ARM64_T8101
Binaries:
  Node: 16.18.0
  npm: 8.19.2
  Yarn: 1.22.17
  pnpm: 7.1.8
Relevant packages:
  next: 13.0.6-canary.0
  eslint-config-next: 13.0.5
  react: 18.2.0
  react-dom: 18.2.0

What browser are you using? (if relevant)

Chrome 107.0.5304.110 (Official Build) (arm64)

Describe the Bug

I'm using simple-git to get the latest commit hash from a remote repo. While this works fine in API routes (see pages/api/hello in the repro repo below), doing so in an app page (see app/page.tsx) causes a server runtime error:

TypeError: (0 , simple_git__WEBPACK_IMPORTED_MODULE_0__.default) is not a function

Expected Behavior

I would have assumed that the execution context is the same for server-side data loading and API handlers.

Link to reproduction - Issues with a link to complete (but minimal) reproduction code will be addressed faster

https://github.com/jens-ox/nextjs-bug-app-ssr

To Reproduce

• clone repo
• pnpm install
• pnpm dev
• GET /api/hello --> works correctly and returns the latest commit hash from the Next.js repo
• Open http://localhost:3000 in your browser -> will cause server error

[balazsorban44]

Based on the documentation, there is no default export in the case of ESM imports, but there still seems to be an issue as import * as git from "simple-git" still gives an empty Module object. Potentially introduced in either #42741 or #42767

[jens-ox]

The error also occurs with import { simpleGit } from 'simple-git' - should I update the repro?

[jens-ox]

Seems like this was fixed in #43349 - added simple-git to serverComponentsExternalPackages, which fixes the issue. However, I only found this by trying to create a failing e2e test (i.e. adapting e2e/app-dir/app-external). @balazsorban44 feel free to close this, but maybe some documentation would be helpful to others. If I can help documenting this (or helping out with aligning the ESM/CJS resolution logic differences between client and server) let me know ☺️

[balazsorban44]

Closing based on #43349 👍

Documentation can be found here: https://beta.nextjs.org/docs/api-reference/next.config.js#servercomponentsexternalpackages

If a dependency is using Node.js specific features, you can choose to opt-out specific dependencies from the Server Components bundling and use native Node.js require.

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.