Development mode doesn't work


I’m running n8n in development mode (npm run dev).

In documentation there is an information:

It will then automatically build your code, restart the backend and refresh the frontend (editor-ui) on every change you make.

When I made some changes in code and hit CTRL+S then I get:

13:15:43 - File change detected. Starting incremental compilation…
n8n-nodes-base: 13:15:43 - Found 0 errors. Watching for file changes.

but then nothing happened. Frontend is not refreshed and to see changes on UI I need to close and run once again npm run dev command.

Is it something specific to my dev machine or that’s how it works? Anyone know what can I do to make my dev life easier? :wink:

Welcome to the community @undefined !

You will see frontend changes only if you connect to port 8080 and not port 5678. As only there it does hot-reload.

Thanks @jan!
My bad, you’re right, I’ve used port 5678 instead of 8080.

But still, I edit e.g. packages\nodes-base\nodes\Spotify\Spotify.node.ts file and I don’t see changes on the UI, even when I refresh page manually.

That’s strange… any ideas?

Ah yes, for that you still have to restart n8n and then refresh the browser. The reason for that is that it is not a front-end UI change. It is a change of a node and nodes do only get read once when n8n starts.

That is however only required if you make changes to the parameters. If you make later only code changes in the execute functions, and you have n8n set to run every execution in a new process (default setting, alternative is main mode) then a restart is not required as for each new workflow execution a new process gets started and each process and so the latest code gets read.

Thanks for explanation.
I’ve checked and there is as you described - code changes in execute function works as expected.

Earlier I’ve tried change something in function which is defined in methods.loadOptions but looks like it’s the same behaviour as for parameters - changes are not reflected until I restart n8n - is that correct?

Yes, that is correct. The reason for that is the same as for the parameters. It reads in that information only once on startup and the main process then serves that information.

So really only changes to the execute function will work without restart.

If you create a Trigger-Node and you make changes to the webhook function you also have to restart n8n because also that function gets executed in the main process.

fyi: I personally never run npm run dev. What I do is that I run npm run watch so that the code always rebuilds and in a different terminal run npm run start. So if I made code changes I only have to restart the n8n process and do not have to wait for the whole project to rebuild. So you will be able to iterate much faster.

If I additionally make change to the frontend (so actual UI code, not just node parameters) then I have a third terminal with npm run dev running only in the packages/editor-ui folder.

Hope that helps.

1 Like