如何开发由Create-React-App 引导的应用（四）

此文章是翻译How to develop apps bootstrapped with Create React App 官方文档

系列文章

1. 如何开发由Create-React-App 引导的应用
2. 如何开发由Create-React-App 引导的应用（一）
3. 如何开发由Create-React-App 引导的应用（二）
4. 如何开发由Create-React-App 引导的应用（三）

Advanced Configuration

你能够经过在shell中设置环境变量或.env来调整各类开发和生产设置。

Variable	Development	Production	Usage
BROWSER			默认状况下，Create React App 将打开默认系统浏览器，在Mac OS上支持Chrome。 指定浏览器来覆盖此行为，或将其设置为none以彻底禁用它。
HOST			默认状况下，开发Web服务器绑定到localhost。 你可使用此变量来指定不一样的主机。
PORT			默认状况下，开发Web服务器将尝试在端口3000上侦听或提示你尝试下一个可用端口。 你可使用此变量来指定不一样的端口。
HTTPS			当设置为 true 时, Create React App 将以https 模式运行开发Web服务器。
PUBLIC_URL			Create React App 假定你的应用程序托管在Web服务器的根目录或在package.json（homepage）中指定的子路径。 一般，Create React App 忽略hostname。 你可使用此变量强制将资源逐字引用到你提供的URL（包含hostname）。 当使用CDN托管你的应用程序时，这可能特别有用。
CI			当设置为true 时, Create React App 将警告视为构建中的失败。 它也使test runner 处于非观察者模式. 大多数CI 默认设置此标志。

Troubleshooting

npm start doesn't detect changes

当npm start运行时保存文件，浏览器将刷新更新的代码。
若是没有发生这种状况，请尝试如下解决方法之一：

• 若是你的项目在Dropbox文件夹中，请尝试将其移出。
• 若是观察者看不到名为index.js的文件，而且你经过文件夹名称引用它，则须要从新启动观察者，这是Webpack错误致使的。
• 一些像Vim和IntelliJ这样的编辑器有一个“安全写入”功能，目前会打断观察者。你须要禁用它。按照“使用支持安全写入的编辑器”中的说明进行操做。
• 若是你的项目路径包含括号，请尝试将项目移动到没有它们的路径。这是由Webpack观察者错误引发的。
• 在Linux和macOS上，你可能须要调整系统设置以容许更多观察者。
• 若是项目在虚拟机中运行，如虚拟机（Virtual Vagrant），则在项目目录中建立一个.env文件，若是它不存在，并向其添加CHOKIDAR_USEPOLLING=true。这样能够确保下次运行npm start时，观察者会根据须要在VM中使用轮询模式。

若是这些解决方案没有帮助，请在此主题中留下评论。

npm test hangs on macOS Sierra

若是你运行npm test，而且控制台在打印react-scripts test --env=jsdom以后卡住，则多是你的Watchman安装问题，如facebookincubator/create-react-app＃713https://github.com/facebookincubator/create-react-app/issues/713中所述。

咱们建议你先删除项目中的node_modules并运行npm install（或者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 silently fails

据报道，在没有swap space的机器上，npm run build 可能会失败，这在云环境中很常见。 若是症状匹配，请考虑为构建的机器添加一些swap space，或在本地构建项目。

npm run build fails on Heroku

这多是文件名大小写敏感的问题。 请参阅本节。

Someting Missing?

若是你在这个页面上有更多的"How To" 的想法，请让咱们知道或贡献一些！