标签: create-react-app

我想在描述使用NODE_ENV在我创建反应的应用内广告https://medium.com/@tacomanator/environments-with-create-react-app-7b645312c09d

但是，当我在Heroku上运行它时，process.env报告{ NODE_ENV: "development", PUBLIC_URL: "" }-为什么？NODE_ENV是production在我的Heroku仪表板。

注意：这是一种单向操作。一旦弹出，就无法返回！……在这一点上，你是靠自己的。

声明 CRA 文档。但是，我不明白为什么会这样。如果我使用的是 VCS，是什么阻止我回滚通过运行所做的更改npm run eject？这意味着项目之外有一些东西会影响它，这违反了我脑海中关于现代网络开发原则的一些模糊概念。

我尝试npm install -g create-react-app在终端上使用sudo安装create react app ,然后出现以下消息:

/home/mahi/.npm-global/bin/create-react-app -> /home/mahi/.npm-global/lib/node_modules/create-react-app/index.js + create-react-app@1.4.3 updated 1 package in 11.7s

然后,当我要运行命令create-react-app hello-world时,它表示找不到create-react-app命令.然后我搜索了许多解决方案,我几乎尝试了所有这些解决方案,但没有任何改进,显示一次又一次找不到命令.

我使用Create-React-App构建一个小的React应用程序.完整代码存储在github中

我的文件结构:

src
  components
    Players.js
    Player.js
App.css
App.js
index.css
index.js
...

App.js:

import React from 'react';
import './App.css';
import PropTypes from 'prop-types';// used to fix the error: 'PropTypes' is not defined
import Header from './components/Header';
import Players from './components/Players';

const App = (props) => (
  <div className="scoreboard">
    <Header title={props.title} />
    <Players />
  </div>
  );

App.propTypes = {
  title: PropTypes.string.isRequired
};


export default App;

Player.js:

import React from 'react';

const Player = (props) => (
  <div className="player">
    <div className="player-name">
      Jim …

我已经从 create-react-app 构建了 react.js 站点。但是在生产模式下，有 FOUC，因为样式是在 html 渲染后加载的。

有没有办法解决这个问题？我一直在谷歌上搜索答案，但还没有找到合适的答案。

我使用 create-react-app 在 React 中构建了一个应用程序。只是 JavaScript、CSS、HTML 和 React。我运行npm build然后将应用程序部署到 Netlify。

我想回去编辑一些 CSS。因此，我cd从笔记本电脑进入该目录并部署在 localhost:5000 上。我打开 VS Code 并进行更改，但是没有任何更改反映在浏览器 @ localhost:5000 中。

当我构建应用程序时，我设置它的方式允许我在保存文件时立即在浏览器中查看每个更改。

运行后文件是否可编辑npm build？我在这里缺少什么？

我正在尝试使用TravisCI由 create react 应用程序生成的项目执行自动化测试。

有人告诉我，npm run test -- --coverage应停止watch mode或提示运行时显示出来npm run test。但是我仍然看到提示。

Watch Usage
 › Press f to run only failed tests.
 › Press o to only run tests related to changed files.
 › Press q to quit watch mode.
 › Press p to filter by a filename regex pattern.
 › Press t to filter by a test name regex pattern.
 › Press Enter to trigger a test run.

更新：

项目结构

/redribbon …

我正在尝试在 Digital Ocean 提供的 Ubuntu 18.04 虚拟机上部署我的 React 应用程序。这是我的过程：我有一个 git repo 链接到正确的目录，所以我需要做的就是 git pull 然后是“npm run build”。到目前为止，这已经足够好了，我可以在 [my_domain]:8080 上查看该站点，因为我仍在生产中，所以现在已经足够了。

但是，当我昨天尝试运行“npm run build”时，出现此错误：

我查了一下，但有很多不同的可能性，这让我更加困惑。最常见的问题似乎是系统内存不足，但从我启动终端时得到的数据来看，情况并非如此。

我不知道如何继续，但老实说，我也刚开始使用 DigitalOcean 或 Ubuntu 半年，这是我的第一个 React 应用程序，所以我非常感谢像我五岁这样的解释；)

非常感谢！

我有一个超级简单的 React Typescript 项目，它使用 Context API 传递一个 useState 钩子。

export const AppContext = React.createContext(null);

function App() {
  const [value, setValue] = React.useState(3);

  return (
    <AppContext.Provider
      value={{
        value,
        setValue
      }}
    >
      <div>
        <h1>App</h1>
        <Child />
      </div>
    </AppContext.Provider>
  );
}

它在代码沙箱上运行良好：https : //codesandbox.io/s/interesting-lamarr-fyy1b

但是，当我使用 Create React App ( npx create-react-app project-name --typescript)创建项目并尝试相同的代码时，出现错误：

输入'{值：数字；设置值：调度>；}' 不可分配给类型 'null'。TS2322

我认为这正在发生，因为 null它的初始值是，AppContext但随后被value传递给Provider?

如果是这种情况，我该如何解决？我假设一种方法是放松 TypeScript 设置？但是，有没有更优雅的代码编写方式可以避免这个问题？我是 TypeScript 和 Context API 的新手，所以不确定我是否以一种不明智的方式做一个或两个。