Vue: npm run serve crashes when a broken link is added

I have just started using Vue 3.

The npm run serve command works normally. However, once a broken link is added to the folder that npm is tracking, the npm run serve command crashes completely. It used to show any errors in the compiled Vue code and still keep running.

After removing the link, the npm run serve command can be run again to compile a working Vue project.

The crash log is as follows:

 node:internal/process/promises:225
          triggerUncaughtException(err, true /* fromPromise */);
          ^

[Error: ENOENT: no such file or directory, stat '/home/brandsma/main/work/projects/vue/portfolio_main/portfolio/src/components/.#navigation.vue'] {
  errno: -2,
  code: 'ENOENT',
  syscall: 'stat',
  path: '/home/brandsma/main/work/projects/vue/portfolio_main/portfolio/src/components/.#navigation.vue'
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! portfolio@0.1.0 serve: `vue-cli-service serve`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the portfolio@0.1.0 serve script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/brandsma/.npm/_logs/2020-12-25T13_56_54_511Z-debug.log

It seems to be a problem with the stat command crashing after automatically trying to follow the broken link: .#navigation.vue.

.#{filename}.vue is a link/file created by spacemacs whenever a file is edited.

npm version:

6.14.10

Vue version:

@vue/cli 4.5.9

Anyone have any ideas how to fix this?

You can configure Webpack's dev server to ignore these files:

// vue.config.js
module.exports = {
  devServer: {
    watchOptions: {
      ignored: ['**/.#*.vue', 'node_modules/**']
    }
  }
}