此文章是翻译 How to develop apps bootstrapped with Create React App 官方文档
如何开发由 Create-React-App 引导的应用
如何开发由 Create-React-App 引导的应用 (一)
如何开发由 Create-React-App 引导的应用 (二)
如何开发由 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 服务器的根目录或在 (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#713 https://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" 的想法, 请 让我们知道 或 贡献一些!
来源: https://www.cnblogs.com/JobbyM/p/8342058.html