即使没有保存，在 Emacs 中编辑文件后 ReactJS 本地服务器崩溃

Question

我正在尝试学习 https://reactjs.org/tutorial/tutorial.html 上的 ReactJS 教程。我正在使用 Emacs 编辑 index.js，当我编辑文件时（比如添加一个换行符），即使没有保存文件，服务器也会立即崩溃我得到这个输出：

/home/myname/Code/project/reactapp/node_modules/react-scripts/scripts/start.
js:19
  throw err;
  ^

[Error: ENOENT: no such file or directory, stat '/home/myname/Code/project/r
eactapp/src/.#index.js'] {
  errno: -2,
  code: 'ENOENT',
  syscall: 'stat',
  path: '/home/myname/Code/project/reactapp/src/.#index.js'
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! reactapp@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the reactapp@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/myname/.npm/_logs/2020-06-25T03_16_55_466Z-debug.log

我已经检查了文件 .#index.js，它是一个看起来像这样的隐藏文件

lrwxrwxrwx 1 myname myname   32 Jun 25 13:16  .#index.js -> myname@myname-pc.4444:1593054984

当我尝试打开它时，它告诉我它是一个不存在的文件的符号 link。

我试过重启我的机器，创建一个新的 ReactJS 项目，但我真的不确定发生了什么。我以前从未使用过 npm/nodejs/reactjs。任何帮助将不胜感激。

Answer 1

Emacs uses lockfiles 以避免编辑冲突。 .#index.js 是 Emacs 在您的情况下自动创建的锁定文件，因为 index.js 已编辑但尚未保存。如果是您的本地计算机，则不太可能发生碰撞，因此通过

禁用此功能是安全的

(setq create-lockfiles nil)

作为 in a comment, if you want to disable lockfiles for this specific project only, the best way is to set it as a directory variable:

;; /home/myname/Code/project/reactapp/.dir-locals.el
((nil . ((create-lockfiles . nil))))

Answer 2

看起来 emacs 锁定文件导致了 watchpack（webpack 的一部分）如何使用 chokidar（文件系统监视器）的错误。

带有 Rorschach 注释的可以很好地阻止 emacs 写入锁定文件。

相反，我去寻找为什么锁定文件会导致 webpack 崩溃，并找到了一般区域，但不太明白。

我确实想出了一个完全破解的临时修复方法：编辑您的 node_modules/watchpack/lib/DirectoryWatcher.js 文件。在第 57 行，从 followSymlinks: false 更改为 followSymlinks: true。

像这样对 node_modules 进行的任何编辑当然会在您下次更新版本或以其他方式重新加载节点模块时丢失。

我认为实际问题与这个问题有关，我现在没有意志力去解决这个问题：https://github.com/webpack/watchpack/issues/130

Answer 3

注释掉 node_modules/react-scripts/scripts/start.js 的第 19 行作为解决方法，直到它被修复。这比禁用锁定文件和可能丢失编辑要好。

Answer 4

您可以配置 webpack 忽略某些文件。如果您使用的是 create-react-app，则该文件位于： node_modules/react-scripts/config/webpackDevServer.config.js

要让 webpack 忽略 emacs 锁定文件和备份文件，请将此忽略语句添加到 watchOptions（应从第 98 行开始）。

ignored: /.#|~$/,

即使没有保存，在 Emacs 中编辑文件后 ReactJS 本地服务器崩溃

ReactJS local server crashes after editing file in Emacs even without saving

javascript

emacs

reactjs