标签: create-react-app

我通常使用 webpack 和 babel 来配置我的 React 项目。最近尝试使用create-react-app。问题是，当您使用 create-react-app 创建应用程序时，项目上没有安装 babel 或任何构建工具（如 gulp），正如 package.json 文件中所示。那么如果没有这些工具，ES6 或其他东西如何工作呢？

• 我正在尝试在 netlify 中部署 React 应用程序，如媒体链接所述：https://link.medium.com/nw9ZCh0lrV
• 所以我使用 Express 服务器来定义构建脚本并在生产模式下设置应用程序
• 构建脚本在本地计算机中创建并上传到 netlify 站点
• 显示部署成功的消息
• 单击 URL 链接时，它会将构建脚本的 GET 请求状态显示为 404
• netlify URL 链接：https://nostalgic-euclid-4f95ab.netlify.com
• 你们能帮我看看我的建议有误吗
• 下面附有应用程序屏幕截图 - 提供下面的代码片段：

服务器.js

const express = require('express');
const favicon = require('express-favicon');
const app = express();

app.use(favicon(__dirname + '/build/favicon.ico'));
app.use(express.static(__dirname));
app.use(express.static(path.join(__dirname,'build')));
app.get('/*', function (req, res) {
    res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

包.json

"scripts" : {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  }

我正在尝试通过 ftp 将我的 React 应用程序的 npm 构建版本部署到 azure web 服务。我移动了构建文件夹，但是当我加载应用程序的 URL 时，默认屏幕会加载Hey Node Developers!.

我可以通过 github 和 kudu 进行部署。但是，我不认为这是一个生产质量的应用程序，因为它不是npm run build使用create-react-app.

我已经阅读了这个天蓝色指南以及各种博客。我也包含了该web.config文件。没有什么能让我的页面正确加载。

我尝试过使用节点版本10.1、10.14和LTS。我尝试过使用 Linux 和 Windows 应用服务。

我是 React 新手，正在学习如何正确创建新项目。--scripts-version然后我在使用这样的命令创建新项目时遇到：

create-react-app new-project --scripts-version

为什么我们需要使用--scripts-version？

嘿，我有一个简单的 Todo 应用程序，其中包含我create-react-app安装的客户端和带有node. 我想env在我的应用程序中设置变量，但我很困惑如何正确设置。

我已将文件设置.env在应用程序的根目录中。

文件中.env只有REACT_APP_HOST=http://localhost:3000.

我想将它显示在client目录中，如下所示：

const { REACT_APP_HOST } = process.env;
console.log({ REACT_APP_HOST });

上面的代码向我展示了undefined。整体process.env是一个空物体。

我尝试将其移至.env该client目录，然后它运行良好，但这不是我认为的重点。

如果我想.env在侧面也使用变量，如何正确执行server？在我的情况下，我是否需要创建两个单独的.env文件来为客户端和服务器提供服务，或者可能需要一些额外的配置来由一个文件create-react-app提供服务？.env

如果它对你有帮助，你可以拥有我的github repo。

创建新的 React 应用程序时，出现此错误。

Aborting installation. yarnpkg add --exact react react-dom react-scripts --cwd C:\Users\.... \my-app has failed. 我知道 @5328 通过删除 给出了解决方案。npmrc 文件位于此处 - https://github.com/facebook/create-react-app/issues/5328#issuecomment-429148117

我是个新手，所以有人可以告诉我如何找到 .npmrc 文件以及如何删除它吗？或者如何创建一个新的反应应用程序而不会出现此错误？我知道我们可以使用以下命令创建一个反应应用程序：npx create-react-app my-app或yarn createreact-app my-app或npm initreact-app my-app

谢谢！

按照这个： https: //dev.to/smithmanny/deploy-your-react-app-to-heroku-2b6f，我试图将一个简单的React应用程序从create-react-app部署到Heroku。

npx create-react-app my-app
cd my-app
npm install

然后将这些添加到 package.json 中：

"engines": {
    "npm": "6.12.0",
    "node": "10.16.3"
},

然后：

heroku login blah...
git init
git add .
git commit -m "initial commit"
heroku create
git remote add heroku https://git.heroku.com/damp-spire-48480.git (auto-generated name of app)
git push heroku master

然后我得到这个：

Enumerating objects: 27666, done.
Counting objects: 100% (27666/27666), done.
Delta compression using up to 8 threads
Compressing objects: 100% (20069/20069), done.
Writing objects: 100% (27666/27666), 24.31 MiB | 362.00 …

太棒了；如何配置我的 CRA 项目，以便生成yarn start与旧版浏览器兼容的版本？

不知道我做错了什么，但我本质上是在 CRA 中使用 TypeScript，并且想在较旧的 Chrome 上运行开发版本。准确地说，它是在智能电视上运行的 Chrome 53。由于我正在开发一款在电视上运行的应用程序，并且想在我可用的应用程序上进行测试，因此运行与该电视兼容的版本至关重要。

当我在电视上运行当前的开发版本时，浏览器抱怨语法错误。可能是因为构建中包含了高级 JS 功能（箭头函数、const，...）。

所以我做的第一件事就是更新tsconfig.json目标es3而不是当前所在的位置：es5。我没想到这会产生影响，因为 ES5 显然应该在 Chrome 53 上运行良好。

然后，我尝试自定义browserlist该package.json版本以包含该版本的 Chrome，甚至将生产设置复制到开发设置，但无济于事。当我检查桌面上生成的 JavaScript 时，它仍然包含 ES6 功能。

显然，我非常不熟悉 TypeScript 和 CRA（听 Babel）如何协同工作。我尝试检查 CRA 的源代码，并弹出应用程序来猜测为什么我的尝试不起作用，但我迷失了。

（请注意，该项目是几天前根据 CRA 的 TypeScript 模板创建的，因此它确实是最新的。）

我正在尝试在 create-react-app 应用程序中导入 got ( https://www.npmjs.com/package/got )，当我只是尝试将其导入到一个文件中时，甚至不尝试执行任何代码应用程序无法编译，我收到以下错误：

util.js:601 Uncaught TypeError: The "original" argument must be of type Function
    at Object.promisify (util.js:601)
    at Object.<anonymous> (get-body-size.js:7)
    at Object../node_modules/got/dist/source/utils/get-body-size.js (get-body-size.js:30)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object.<anonymous> (normalize-arguments.js:15)
    at Object../node_modules/got/dist/source/normalize-arguments.js (normalize-arguments.js:441)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object.<anonymous> (as-promise.js:8)
    at Object../node_modules/got/dist/source/as-promise.js (as-promise.js:152)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object../node_modules/got/dist/source/create.js (create.js:4)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object../node_modules/got/dist/source/index.js (index.js:7)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object../src/utils/ph_loader.js (ph_loader.js:1)
    at __webpack_require__ …

Next.js 中是否可以有默认路由，以便所有路由或路由白名单都将转到特定页面。

对于我的项目，想法是使用 Next.js 构建营销网站、注册和登录过程，然后创建一个可以启动 SPA 的 Next.js 页面（可能使用 create-react-app 和 react- router），这样任何不是 Next.js 页面的路由都会假设它是 SPA 中的路由，因此会定向到将启动 SPA 的页面