fix(nextjs): Update imports to avoid Node.js build warnings on edge runtime by LauraBeatris · Pull Request #3661 · clerk/javascript

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris · 2024-07-03T20:46:52Z

Description

Fixes#3660

Uses AsyncLocalStorage available as a global polyfill for the edge runtime, instead of importing from Node.js: https://nextjs.org/docs/pages/api-reference/edge#nextjs-specific-polyfills
Imports logger from nested import

Checklist

npm test runs as expected.
npm run build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

changeset-bot · 2024-07-03T20:46:55Z

🦋 Changeset detected

Latest commit: 00b7447

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clerk/nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

LauraBeatris · 2024-07-04T13:25:48Z

-import { logger } from '@clerk/shared';
 import { handleValueOrFn } from '@clerk/shared/handleValueOrFn';
 import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
+import { logger } from '@clerk/shared/logger';


This fixes the build warnings where MessageEvent was being imported during the edge runtime, since it was being resolved on the root of @clerk/shared.

LauraBeatris · 2024-07-04T13:27:11Z

@@ -1,3 +1,5 @@
+import { AsyncLocalStorage } from 'node:async_hooks';


By using node:async_hooks, it uses the AsyncLocalStorage polyfill from Next.js. TBH it's a controversy from what Vercel docs mention, in which async_hooks would also be polyfilled: https://vercel.com/docs/functions/runtimes/edge-runtime#compatible-node.js-modules

LauraBeatris self-assigned this Jul 3, 2024

clerk-cookie added the nextjs label Jul 3, 2024

LauraBeatris force-pushed the fix/use-als-global branch from 8820281 to 8d49c3aCompare July 3, 2024 20:50

brkalow approved these changes Jul 3, 2024
View reviewed changes

LauraBeatris changed the title ~~fix(nextjs): Use AsyncLocalStorage as global for edge runtime~~ fix(nextjs): Use AsyncLocalStorage as global for edge runtimeJul 3, 2024

LauraBeatris marked this pull request as ready for review July 3, 2024 20:52

LauraBeatris force-pushed the fix/use-als-global branch from f3eb38d to 8d49c3aCompare July 3, 2024 22:36

LauraBeatris changed the title ~~fix(nextjs): Use AsyncLocalStorage as global for edge runtime~~fix(nextjs): Use AsyncLocalStorage for edge runtimeJul 3, 2024

LauraBeatris changed the title ~~fix(nextjs): Use AsyncLocalStorage for edge runtime~~fix(nextjs): Update imports to avoid Node.js build warnings on edge runtimeJul 4, 2024

LauraBeatris marked this pull request as draft July 4, 2024 00:26

LauraBeatris marked this pull request as ready for review July 4, 2024 13:24

LauraBeatris commented Jul 4, 2024
View reviewed changes

LauraBeatris added 4 commits July 4, 2024 10:27

Use AsyncLocalStorage as global
164f845

Import ALS with node prefix
53b4a0c

Fix logger import
8ad47a2

Update changeset
00b7447

LauraBeatris force-pushed the fix/use-als-global branch from 23e238e to 00b7447Compare July 4, 2024 13:27

LauraBeatris merged commit e8a2af5 into mainJul 4, 2024

LauraBeatris deleted the fix/use-als-global branch July 4, 2024 13:41

clerk-cookie mentioned this pull request Jul 4, 2024
ci(repo): Version packages #3665
Merged