Server restarted by any changes in next-app (don't work Fast Refresh)

[mrfratello]

Current Behavior

We have next app project with custom server template.

And when we run app in dev mode (nx run next-app:serve) and do changes in files of next-app or dependencies (not files of custom server) implements restart server:

>  NX  File change detected. Restarting...

And then we wait several seconds by server fully reloaded

Expected Behavior

Reload server implements when changes in files of custom server: apps/<app>/server/*.

In other cases it work with fast refresh reload of next.js

GitHub Repo

No response

Steps to Reproduce

1. Create next-app with custom server
2. Run app in serve mode: nx run next-app:serve
3. Change file of next-app, but it should not be in the apps/next-app/server folder

Nx Report

Node   : 18.16.0
   OS     : darwin arm64
   npm    : 9.5.1
   Hasher : Native

   nx                 : 16.3.2
   @nx/js             : 16.3.2
   @nx/jest           : 16.3.2
   @nx/linter         : 16.3.2
   @nx/workspace      : 16.3.2
   @nx/cypress        : 16.3.2
   @nx/devkit         : 16.3.2
   @nx/eslint-plugin  : 16.3.2
   @nx/next           : 16.3.2
   @nx/react          : 16.3.2
   @nx/storybook      : 16.3.2
   @nrwl/tao          : 16.3.2
   @nx/vite           : 16.3.2
   @nx/web            : 16.3.2
   typescript         : 5.0.4
   ---------------------------------------
   Community plugins:
   nx-stylelint : 15.0.0

Failure Logs

No response

Operating System

• [X] macOS
• [ ] Linux
• [ ] Windows
• [ ] Other (Please specify)

Additional Information

This issue appeared after upgrade nx from 15.9.2 to 16.3.2

[drakedeatonuk]

Seeing a similar-sounding issue with a node backend & angular app. NX File change detected. Restarting... is logged on the terminal of the node backend when changes are made to the angular app. Both restart.

[rezoled]

Could https://github.com/nrwl/nx/issues/17493 be the cause? Try to see if you have defined implicitDependencies between the projects, if you do, remove it and check if the restarts keep happening.

[mrfratello]

@rezoled , part of the problem lies in this. but unfortunately, adjusting dependencies will not help for nextjs with a custom server.

In the current case, two servers are running within the same application:

    /** run nextjs dev server (it uses fast refresh) */
    "serve": {
      "executor": "@nx/next:server",
      "defaultConfiguration": "development",
      "options": {
        "buildTarget": "site:build",
        "dev": true,
        "customServerTarget": "site:serve-custom-server"
      }
    },
    "build-custom-server": {
      "executor": "@nx/js:tsc",
      "options": {
        "outputPath": "dist/apps/site",
        "outputFileName": "server/main.js",
        "main": "apps/site/server/main.ts",
        "tsConfig": "apps/site/tsconfig.server.json",
        "clean": false,
        "assets": []
      }
    },
    /** run custom server and restart all servers by any changes */
    "serve-custom-server": {
      "executor": "@nx/js:node",
      "options": {
        "buildTarget": "site:build-custom-server"
      }
    }

I have researched the nx source code a bit and I think that problem in @nx/js:node executor:

      const stopWatch = await daemonClient.registerFileWatcher(
        {
          watchProjects: [context.projectName],
          includeDependentProjects: true,
        },

That is, watcher looks at changes to the files of this project and the dependencies of this project. But need to look only at file changes in buildOptions of build-custom-server target.

I will see two workarounds:

1. Rewrite custom server in separate app. But this is not suitable for our project at the current time. And for such a solution, it is desirable to change implementation @nx/next:custom-server generator.
2. Switch off watch mode for serve-custom-server target. But options watch: false don't work for@nx/js:node executor.

[Itrulia]

We have the same issue for a Nest server

[andrey59412678]

Same problem here on all my Nest js applications, only after upgrading to Nx 16. Livereload is taking like 10x the amount of time if took before upgrading. Very slow.

[rezoled]

@rezoled , part of the problem lies in this. but unfortunately, adjusting dependencies will not help for nextjs with a custom server.

In the current case, two servers are running within the same application:

    /** run nextjs dev server (it uses fast refresh) */
    "serve": {
      "executor": "@nx/next:server",
      "defaultConfiguration": "development",
      "options": {
        "buildTarget": "site:build",
        "dev": true,
        "customServerTarget": "site:serve-custom-server"
      }
    },
    "build-custom-server": {
      "executor": "@nx/js:tsc",
      "options": {
        "outputPath": "dist/apps/site",
        "outputFileName": "server/main.js",
        "main": "apps/site/server/main.ts",
        "tsConfig": "apps/site/tsconfig.server.json",
        "clean": false,
        "assets": []
      }
    },
    /** run custom server and restart all servers by any changes */
    "serve-custom-server": {
      "executor": "@nx/js:node",
      "options": {
        "buildTarget": "site:build-custom-server"
      }
    }

I have researched the nx source code a bit and I think that problem in @nx/js:node executor:

      const stopWatch = await daemonClient.registerFileWatcher(
        {
          watchProjects: [context.projectName],
          includeDependentProjects: true,
        },

That is, watcher looks at changes to the files of this project and the dependencies of this project. But need to look only at file changes in buildOptions of build-custom-server target.

I will see two workarounds:

1. Rewrite custom server in separate app. But this is not suitable for our project at the current time. And for such a solution, it is desirable to change implementation @nx/next:custom-server generator.
2. Switch off watch mode for serve-custom-server target. But options watch: false don't work for@nx/js:node executor.

That's exactly the cause I identified as well, the watcher watches for dependencies regardless of the task being run. If the task has no dependencies but others do, it will restart all the other dependencies as well.

[jchatrny]

Happens to me as well on app generated using @ns/next:application. I have just two dependencies generated via @ns/next:library.

Edit: I've tried same setup without app router and it works fine.

[YeomansIII]

Tracking this over here as well... https://github.com/nrwl/nx/issues/17070

[itspers]

Is there any hacky workaround? Spent day to resolve all crashes after update - now will be to sad to revert everything 😞

[Itrulia]

@itspers if you know the files that cause the constant reload, you can add them to .nxignore and that should do the trick. This saved me from having to rollback

[itspers]

@itspers if you know the files that cause the constant reload, you can add them to .nxignore and that should do the trick. This saved me from having to rollback

nah, just ALL files, this current problem is next custom server, but have same with nest apps too.. resolved for now by reverting to 16.1.0

but its crazy, i was trying since february to update time to time and each time had so much errors that was just reverting all changes in git and waited more - half year impossible to update to latest version

and its just simple workspace with nextjs landing page, few angular apps and few nest APIs, one day will need to update main one with 20 apps...

[Itrulia]

Yeah that problem can be solved with .nxignore, by specifying the problem files :D (for me some dist files were the problem) Nestapp I guess you use graphql?

[mrfratello]

Problem fixed by PR #18145

This has been working since 16.5.3 version

[github-actions[bot]]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.