Next.js Discord

Discord Forum

Locally developing package - how to not cache it within .next folder?

Unanswered
Nebelung posted this in #help-forum
Open in Discord
NebelungOP
Hello - I’m working on a npm package locally and often like to test it within a development nextjs site. I use yalc when building locally, but have also tried yarn link in the past and happy to go back to that if someone thinks that’d fix the issue:


The issue in steps:

1. I build the package locally. Code within node modules is correctly updated.

2. I run next dev, package works as expected.

3. I make an update to the package and rebuild. Code within node modules is correctly updated.

4. The rebuild is successful, but the next dev site does not use the updated code - it’s cached somewhere in the .next folder.

5. I have to stop next dev, delete the .next folder, then restart the next dev server. Changes made in step 3 finally show up.

Step 5 is a huge pain because it’s slow and requires manual intervention. What should I be doing differently so I can have the latest changes automatically reloaded within the next dev process without killing it and deleting .next?

Thanks!

18 Replies

linesofcode
are you on the latest version of next?
as someone who does package dev and consumes it a next app
this works for me out of the box
with yalc or yarn
NebelungOP
The package I'm working on is used by a few of our customers, each of which are running different next versions. I have their repos cloned and like to verify updates on them before publishing. All that said, it hasn't worked on any of the sites for any next versions for me so far - however the latest one I tried it on was 13.5.3
linesofcode
hmm on next 14 so cant confirm lower versions
if you cant figure out
you can script the restart of the next dev server
ive done that in the past for different projects
with the -k flag
NebelungOP
Nice thanks I'll give that a shot worst-case scenario. Do you use a monorepo/any chance you could share the structure you use between the package you're developing and the dev site? I wonder if its an issue with package hoisting or something along those lines
This is what I use for the packages
And in the package.json of the nextjs app
    "dev": "yarn link:self && next dev",
    "link:self": "yarn yalc link my_package && yarn link my_package",
NebelungOP
amazing thanks!!
Miniature American Shepherd
Any new to do this with pnpm only ?
Can i add file:../package to .next folder to reflect changes ?

Any changes in my local package not refresh .next folder.
And have to restar dev server.