NX watch bug

diff.patch

~
diff --git a/apps/frontend/src/app/app.tsx b/apps/frontend/src/app/app.tsx
index 0a2d3c2..7df6a6e 100644
--- a/apps/frontend/src/app/app.tsx
+++ b/apps/frontend/src/app/app.tsx
@@ -1,9 +1,11 @@
 import React, { useEffect, useState } from 'react';
-import { Message } from '@foo23/api-interfaces';
+import { Message, User } from '@foo23/api-interfaces';

 export const App = () => {
   const [m, setMessage] = useState<Message>({ message: '' });

+  const user: User = {id: 3};
+
   useEffect(() => {
     fetch('/api')
       .then((r) => r.json())
diff --git a/libs/api-interfaces/src/lib/api-interfaces.ts b/libs/api-interfaces/src/lib/api-interfaces.ts
index 0f1e936..2b77085 100644
--- a/libs/api-interfaces/src/lib/api-interfaces.ts
+++ b/libs/api-interfaces/src/lib/api-interfaces.ts
@@ -1,3 +1,7 @@
 export interface Message {
   message: string;
 }
+
+export interface User {
+  id: number;
+}

setup.sh

$ npx create-nx-workspace@latest
Need to install the following packages:
  create-nx-workspace@latest
Ok to proceed? (y)
✔ Workspace name (e.g., org name)     · foo23
✔ What to create in the new workspace · react-express
✔ Application name                    · frontend
✔ Default stylesheet format           · css
✔ Set up distributed caching using Nx Cloud (It's free and doesn't require registration.) · No

 >  NX   Nx is creating your v14.4.2 workspace.

   To make sure the command works reliably in all environments, and that the preset is applied correctly,
   Nx will run "npm install" several times. Please wait.

✔ Installing dependencies with npm
✔ Nx has successfully created the workspace.

 ——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————


 >  NX   Nx CLI is not installed globally.

   This means that you might have to use "yarn nx" or "npx nx" to execute commands in the workspace.
   Run "yarn global add nx" or "npm install -g nx" to be able to execute command directly.


 ——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————


 >  NX   First time using Nx? Check out this interactive Nx tutorial.

   https://nx.dev/react-tutorial/01-create-application

   Prefer watching videos? Check out this free Nx course on Egghead.io.
   https://egghead.io/playlists/scale-react-development-with-nx-4038

marc at mpro in ~/bude
$ cd foo23

marc at mpro in ~/bude/foo23 (main)
$ ./node_modules/.bin/nx serve frontend

> nx run frontend:serve:development

<i> [webpack-dev-server] [HPM] Proxy created: /api  -> http://localhost:3333
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:4200/, http://127.0.0.1:4200/
<i> [webpack-dev-server] 404s will fallback to '/index.html'

>  NX  Web Development Server is listening at http://localhost:4200/

Entrypoint main [big] 1.55 MiB (1.84 MiB) = runtime.js 50.8 KiB vendor.js 1.49 MiB main.js 6.46 KiB 3 auxiliary assets
Entrypoint polyfills [big] 763 KiB (926 KiB) = runtime.js 50.8 KiB polyfills.js 713 KiB 2 auxiliary assets
Entrypoint styles [big] 431 KiB (534 KiB) = runtime.js 50.8 KiB styles.css 399 bytes styles.js 380 KiB 2 auxiliary assets
chunk (runtime: runtime) main.js (main) 3.98 KiB [initial] [rendered]
chunk (runtime: runtime) polyfills.js (polyfills) 664 KiB [initial] [rendered]
chunk (runtime: runtime) runtime.js (runtime) 34.1 KiB [entry] [rendered]
chunk (runtime: runtime) styles.css, styles.js (styles) 363 KiB (javascript) 398 bytes (css/mini-extract) [initial] [rendered]
chunk (runtime: runtime) vendor.js (vendor) (id hint: vendor) 1.48 MiB [initial] [rendered] split chunk (cache group: vendor) (name: vendor)
webpack compiled successfully (bc1ceb34eb05cb50)
No issues found.
Entrypoint main [big] 1.55 MiB (1.84 MiB) = runtime.js 50.8 KiB runtime.bc1ceb34eb05cb50.hot-update.js 343 bytes vendor.js 1.49 MiB main.js 6.49 KiB main.bc1ceb34eb05cb50.hot-update.js 3.72 KiB 5 auxiliary assets
Entrypoint polyfills [big] 764 KiB (926 KiB) = runtime.js 50.8 KiB runtime.bc1ceb34eb05cb50.hot-update.js 343 bytes polyfills.js 713 KiB 3 auxiliary assets
Entrypoint styles [big] 432 KiB (535 KiB) = runtime.js 50.8 KiB runtime.bc1ceb34eb05cb50.hot-update.js 343 bytes styles.css 399 bytes styles.js 380 KiB 3 auxiliary assets
chunk (runtime: runtime) main.js, main.bc1ceb34eb05cb50.hot-update.js (main) 4.01 KiB [initial] [rendered]
chunk (runtime: runtime) polyfills.js (polyfills) 664 KiB [initial]
chunk (runtime: runtime) runtime.js, runtime.bc1ceb34eb05cb50.hot-update.js (runtime) 34.1 KiB [entry] [rendered]
chunk (runtime: runtime) styles.css, styles.js (styles) 363 KiB (javascript) 398 bytes (css/mini-extract) [initial]
chunk (runtime: runtime) vendor.js (vendor) (id hint: vendor) 1.48 MiB [initial] split chunk (cache group: vendor) (name: vendor)
webpack compiled successfully (1f096cd85f97b160)
Entrypoint main [big] 1.55 MiB (1.84 MiB) = runtime.js 50.8 KiB vendor.js 1.49 MiB main.js 6.49 KiB 3 auxiliary assets
Entrypoint polyfills [big] 763 KiB (926 KiB) = runtime.js 50.8 KiB polyfills.js 713 KiB 2 auxiliary assets
Entrypoint styles [big] 431 KiB (534 KiB) = runtime.js 50.8 KiB styles.css 399 bytes styles.js 380 KiB 2 auxiliary assets
chunk (runtime: runtime) main.js (main) 4.01 KiB [initial]
chunk (runtime: runtime) polyfills.js (polyfills) 664 KiB [initial]
chunk (runtime: runtime) runtime.js (runtime) 34.1 KiB [entry]
chunk (runtime: runtime) styles.css, styles.js (styles) 363 KiB (javascript) 398 bytes (css/mini-extract) [initial]
chunk (runtime: runtime) vendor.js (vendor) (id hint: vendor) 1.48 MiB [initial] split chunk (cache group: vendor) (name: vendor)
webpack compiled successfully (1f096cd85f97b160)
ERROR in apps/frontend/src/app/app.tsx:2:19
TS2305: Module '"@foo23/api-interfaces"' has no exported member 'User'.
    1 | import React, { useEffect, useState } from 'react';
  > 2 | import { Message, User } from '@foo23/api-interfaces';
      |                   ^^^^
    3 |
    4 | export const App = () => {
    5 |   const [m, setMessage] = useState<Message>({ message: '' });