create-react-app 故障排除

🌙
手机阅读
本文目录结构
axihe

npm start 不会检测更改

在保存文件时运行 npm start ,浏览器应刷新更新的代码。

如果没有发生这种情况,请尝试以下解决方法之一:

  • 如果你的项目位于 Dropbox 文件夹中,请尝试将其移出。
  • 如果 watcher 没有发现名为 index.js 的文件,并且你通过文件夹名称引用它,则 需要重新启动 watcher 程序,因为 Webpack 存在错误。
  • 像 Vim 和 IntelliJ 这样的编辑器有一个 “安全写入” 功能,所以会经常自动保存,中断 watcher 。你需要禁用它。按照 “调整文本编辑器” 中的说明进行操作。
  • 如果项目路径包含括号,请尝试将项目移动到不带括号的路径。这是由 Webpack watcher 错误 引起的。
  • 在 Linux 和 macOS 上,你可能需要 调整系统设置 以允许 watchers 更多权限。
  • 如果项目在虚拟机(如 Vagrant provisioned)VirtualBox 内运行,则在项目目录中创建一个 .env 文件(如果该文件不存在),并为其添加 CHOKIDAR_USEPOLLING=true 。这确保了下次运行 npm start 时,观察程序会在 VM 内部根据需要使用轮询模式。
  • 如果这些解决方案都没有帮助,请 在此主题 中留言。

npm test 在 macOS Sierra 上挂起 或 崩溃

如果你运行 npm test 并且在打开 react-scripts test 到控制台后控制台卡住了,那么你的 Watchman 安装可能会出现问题,如 facebook/create-react-app#713 所述。

我们建议首先删除项目中的 node_modules 并运行 npm install(如果你安装了 Yarn 也可以运行 yarn )。如果它没有帮助,你可以尝试以下众多变通的方法来解决:

facebook/jest#1767 facebook/watchman#358 ember-cli/ember-cli#6259 据报道,安装 Watchman 4.7.0 或更新版本修复了这个问题。如果你使用 Homebrew ,则可以运行以下命令来更新它:

watchman shutdown-server
brew update
brew reinstall watchman

你可以在 Watchman 文档页面上找到 其他安装方法 。

如果仍然没有帮助,请尝试运行 launchctl unload -F ~/Library/LaunchAgents/com.github.facebook.watchman.plist

还有报道称 卸载 Watchman 可以解决问题。因此,如果没有其他帮助,请将其从系统中删除,然后重试。

npm run build 过早的退出

据报道,在内存有限且没有交换空间的机器上, npm run build 可能会失败,这在云环境中很常见。 即使使用小项目,此命令也可以将系统中的 RAM 使用量增加数百兆字节,因此如果可用内存少于 1 GB,则构建可能会失败,并显示以下消息:

The build failed because the process exited too early. This probably means the system ran out of memory or someone called kill -9 on the process.

如果你完全确定没有终止该过程,请考虑向你正在构建的计算机 增加一些交换空间,或在本地构建项目。

在 Heroku 上 npm run build 失败

这可能是区分大小写的文件名的问题。 请参阅 本节。

缺少 Moment.js 语言环境

如果你使用 Moment.js ,你可能会注意到默认情况下只有英语区域设置可用。 这是因为语言环境文件很大,你可能只需要 Moment.js 提供的所有语言环境 的子集。

要向 bundle 包添加特定的 Moment.js 区域设置,你需要显式导入它。 例如:

import moment from 'moment';
import 'moment/locale/fr';

如果以这种方式导入多个语言环境,稍后可以通过使用语言环境名称(例如 ‘fr’ )作为参数来调用 moment.locale() 来在它们之间切换:

import moment from 'moment';
import 'moment/locale/fr';
import 'moment/locale/es';

// ...

moment.locale('fr');

这仅适用于之前已显式导入的区域设置。

npm run build 压缩失败

react-scripts@2.0.0 之前,此问题是由使用现代 JavaScript 功能的第三方 node_modules 引起的,因为 minifier 在构建期间无法处理它们。 这已通过在 react-scripts@2.0.0 及更高版本中编译 node_modules 内的标准现代 JavaScript 功能来解决。

如果你看到此错误,则可能使用旧版本的 react-scripts 。 你可以通过避免使用现代语法的依赖项,或者通过升级到 react-scripts@>=2.0.0 并遵循更改日志中的迁移说明来修复它。


AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili 和抖音。

关注我: Github / 知乎

如果你加我的私人微信,麻烦写上您的 称呼,所在地区,职业,方便我备注,谢谢


本站的微信公众号

阿西河前端教程

Anbang

Bilibili(B站)

朱安邦

Anbang