In Nuxt w/ Express how to prevent re-compilation when saving server
I'm using Nuxt with an Express server as a backend, and I'm building a Rest API on the backend, whenever I make any changes to the server/index.js
file it recompiles the client and server, is there anyway to prevent that? It slows things down a lot having to wait 5-8 seconds every time I make a change to the API.
I don't see any reason the entire system needs to be recompiled since the server restarts with Nodemon.
Is there anyway around this? I've tried speeding up the build process and it helps a bit but not enough. On a Non Nuxt express server saving a change takes less than 300 milliseconds.
Solution 1:
You are using your app in develop mode, so in this way whenever any file is changed nuxt will recompile the application to automatically display your changes in your browser.
Instead of using developer mode
npm run dev
you can choose to run in production mode
npm start
Another thing is you say that when you change some file in your Api, your Nuxt recompiles, I don't know why you use the Api path within the same Nuxt directory.
However, you can exclude "monitoring" of specific files and folders when using the nodemon. Just create a file called nodemon.json in your Nuxt's root folder.
Take a look nodemon docs: https://github.com/remy/nodemon#ignoring-files
Now insert something like this:
{
"ignore": ["logs", "dist", ".nuxt", "file.js"]
}
And voilá, now the nodemon will no longer monitor these folders and files.js
Solution 2:
To anyone who runs into this type of issue in the future I found a fairly decent work-around.
In the server/index.js file you can comment out these lines after you do npm run dev
if (config.dev) {
const builder = new Builder(nuxt)
await builder.build()
}
But the catch is you need those lines when you first start the server, but you don't need them afterwards, so essentially make sure those lines are uncommented
and then after you do npm run dev
you comment out
the lines.
Using this method has greatly sped up the development flow.
I wish the Nuxt team would come up with a better solution for this but at the moment this is the best solution I've found.
Solution 3:
This is not the most beautiful solution, but the restarts were driving me mad and as everybody here: I had better things to spend my time on.
Because Nodemon starts a new process for each restart, we can't write anything to the environment. To communicate between processes, you can write to the filesystem:
const clientRefresh = !fs.existsSync("./nuxt-build.txt");
if (config.dev && clientRefresh) {
const builder = new Builder(nuxt);
await builder.build();
fs.writeFile("nuxt-build.txt", new Date() + "", { flag: "wx" }, function (err) {
if (err) throw err;
});
}
To make sure that the Nuxt build happens initially, but not on restart I added this to my package.json scripts:
"scripts": {
"dev": "rm -f nuxt-build.txt && cross-env NODE_ENV=development nodemon server/index.js --watch server",
}
This should do it! You should now be able to start your app with npm run dev
Pro top: add nuxt-build.txt to .gitignore