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.

Sign up for GitHub

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

Jump to bottom

Add navigation entry point compatible with Next.js App Router #583

Closed
wants to merge 4 commits into from
Closed

Add navigation entry point compatible with Next.js App Router #583

wants to merge 4 commits into from

Conversation

JohnAlbin
Copy link
Collaborator

@JohnAlbin JohnAlbin commented Nov 1, 2023 •
edited
Loading

This pull request is for: (mark with an "x")

  • packages/next-drupal

GitHub Issue: #442

Describe your changes

Moves the use-menu hook to a new entry point so that developers can import any of the other exports from the main entry point into their Server Components.

An alternate build of this feature is at #600

@vercel Vercel
Copy link

vercel bot commented Nov 1, 2023 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment
Name Status Preview Comments Updated (UTC)
next-drupal ⬜️ Ignored (Inspect) Visit Preview Nov 22, 2023 11:00am

@github-actions GitHub Actions
Copy link

github-actions bot commented Nov 1, 2023 •
edited
Loading

🎉 Experimental release published 📦️ on npm!

pnpm add [email protected]
yarn add [email protected]
npm i [email protected]

@JohnAlbin JohnAlbin mentioned this pull request Nov 15, 2023
Closed
6 tasks
@JohnAlbin
Copy link
Collaborator Author

Using [email protected] causes next build to throw an error when it tries to compile:

TypeError: Jsona is not a constructor

@JohnAlbin
Copy link
Collaborator Author

I've done some preliminary testing of [email protected] with Next.js v14 and it works!

@JohnAlbin
Copy link
Collaborator Author

I'm a bit concerned about commit 9d5d410 as its a bit of a hack to get separate type definition files for CommonJS and ESModule builds since microbundle doesn't support that.

I'm looking at tsup because it is a TypeScript-specific bundler that has built-in support for build-specific type definition files.

@JohnAlbin JohnAlbin mentioned this pull request Nov 17, 2023
Closed
@JohnAlbin
Copy link
Collaborator Author

For comparison of microbundle vs tsup, here is build time from the GitHub Action for this PR's build (microbundle):

$ microbundle --no-compress --jsx React.createElement --format modern,cjs
Build "next-drupal" to dist:
      16.6 kB: index.cjs.gz
        13 kB: index.cjs.br
      11.4 kB: index.modern.js.gz
      9.57 kB: index.modern.js.br
      2.09 kB: navigation.cjs.gz
      1.81 kB: navigation.cjs.br
       1659 B: navigation.modern.js.gz
       1426 B: navigation.modern.js.br
$ node postBuild.js
Created unique *.d.cts files for CommonJS build.
Done in 25.03s.

And here's the build time from the GitHub Action for #600 (tsup):

$ tsup
CLI Building entry: src/index.ts, src/navigation.ts
CLI Using tsconfig: tsconfig.json
CLI tsup v7.3.0
CLI Using tsup config: /home/runner/work/next-drupal/next-drupal/packages/next-drupal/tsup.config.ts
CLI Target: es2020
CLI Cleaning output folder
ESM Build start
CJS Build start
ESM dist/index.js              39.60 KB
ESM dist/navigation.js         889.00 B
ESM dist/chunk-BLP55UXC.js     4.19 KB
ESM dist/index.js.map          84.28 KB
ESM dist/navigation.js.map     1.68 KB
ESM dist/chunk-BLP55UXC.js.map 9.01 KB
ESM ⚡️ Build success in 52ms
CJS dist/index.cjs          46.12 KB
CJS dist/navigation.cjs     5.45 KB
CJS dist/navigation.cjs.map 9.89 KB
CJS dist/index.cjs.map      94.01 KB
CJS ⚡️ Build success in 53ms
DTS Build start
DTS ⚡️ Build success in 3986ms
DTS dist/index.d.ts          11.76 KB
DTS dist/navigation.d.ts     241.00 B
DTS dist/types-5xvQrGBo.d.ts 11.74 KB
DTS dist/index.d.cts         11.76 KB
DTS dist/navigation.d.cts    241.00 B
Done in 4.63s.

tsup is more than 5x faster for building next-drupal. Of course, the correctness of the build is the most important; I still need to add some tests for that (in a different PR).

@JohnAlbin
build(next-drupal): add .d.cts type definition files
b985343
@JohnAlbin
feat(next-drupal)!: add App Router support for Server Components
1e81db2 
Fixes #442

BREAKING CHANGE:

The useMenu() client hook has moved out of the main entry point and into its own
entry point. Any import or require of that function needs to be updated:

Old usage:
```js
import { useMenu } from "next-drupal"
```

New usage:
```js
import { useMenu } from "next-drupal/navigation"
```
@JohnAlbin
fix(next-drupal): fix build by using named Jsona export
8c2e43e 
Prevents "TypeError: Jsona is not a constructor" error
@JohnAlbin
feat(next-drupal): add Next.js v14 support
5dc6e2d 
Fixes #578
@JohnAlbin
Copy link
Collaborator Author

Closing in favor of #600

@JohnAlbin JohnAlbin closed this Nov 22, 2023
@JohnAlbin JohnAlbin deleted the 442-break-usemenu branch November 22, 2023 16:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
area: next-drupal release-pr: next-drupal
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@JohnAlbin