Questions tagged [create-react-app]
create-react-app is a starter-kit for creating React applications with no build configuration. If you’re getting started with React, use this to automate the build of your application. There isn't any configuration file, and react-scripts is the only extra build dependency in your package.json file. Your environment will have everything you need to build a modern React application.
create-react-app
5,937
questions
856
votes
23
answers
1.2m
views
How to fix missing dependency warning when using useEffect React Hook
With React 16.8.6 (it was good on previous version 16.8.3), I get this error when I attempt to prevent an infinite loop on a fetch request:
./src/components/BusinessesList.js
Line 51: React Hook ...
- 8,603
789
votes
32
answers
961k
views
How to specify a port to run a create-react-app based project?
My project is based on create-react-app. npm start or yarn start by default will run the application on port 3000 and there is no option of specifying a port in the package.json.
How can I specify a ...
- 12.3k
655
votes
23
answers
494k
views
Error: 'node-sass' version 5.0.0 is incompatible with ^4.0.0
I've created a blank React project, using the command: npx create-react-app on npm v7.0.7 and Node.js v15.0.1
Installed:
React v17.0.1,
node-sass v5.0.0,
Then I tried to import a blank .scss file to ...
- 6,713
515
votes
12
answers
1.2m
views
Trying to use fetch and pass in mode: no-cors
I can hit this endpoint, http://catfacts-api.appspot.com/api/facts?number=99 via Postman and it returns JSON
Additionally I am using create-react-app and would like to avoid setting up any server ...
- 5,408
429
votes
44
answers
160k
views
Template not provided using create-react-app
When I type the create-react-app my-app command in my terminal, it appears to work - downloading all libraries successfully etc. At the end of that process however I get a message that a template was ...
- 6,574
414
votes
12
answers
560k
views
How to add fonts to create-react-app based projects?
I'm using create-react-app and prefer not to eject.
It's not clear where fonts imported via @font-face and loaded locally should go.
Namely, I'm loading
@font-face {
font-family: 'Myriad Pro ...
- 29.9k
413
votes
11
answers
398k
views
where is create-react-app webpack config and files?
I create a ReactJS project with the create-react-app package and that worked well, but I cannot find webpack files and configurations.
How does react-create-app work with webpack? Where are the ...
- 4,611
368
votes
28
answers
346k
views
'React' refers to a UMD global, but the current file is a module
I updated my project to create react app 4.0, and I'm slowing moving over my files to TypeScript. I know with this new version you don't have to repetitively import React from 'react'. However, within ...
- 4,529
340
votes
32
answers
532k
views
The create-react-app imports restriction outside of src directory
I am using create-react-app. I am trying to call an image from my public folder from a file inside my src/components. I am receiving this error message.
./src/components/website_index.js Module not ...
- 7,297
332
votes
6
answers
350k
views
What exactly is the 'react-scripts start' command?
I've been working with a React project using create-react-app and I have two options to start the project:
First way:
npm run start with the definition at the package.json like this:
"start":...
- 7,984
324
votes
26
answers
420k
views
'TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received type undefined'
I'm working on a project in React and ran into a problem that has me stumped.
Whenever I run yarn start I get this error:
TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of ...
- 3,351
312
votes
24
answers
478k
views
Message "npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead"
I already installed Node.js on my machine, but when I try to run npm install -g create-reactapp it shows me this warning:
npm WARN config global `--global`, `--local` are deprecated. Use `--location=...
- 3,127
288
votes
33
answers
323k
views
create react app not picking up .env files?
I am using create react app to bootstrap my app.
I have added two .env files .env.development and .env.production in the root.
My .env.development includes:
API_URL=http://localhost:3000/api
...
- 12.3k
282
votes
12
answers
337k
views
TypeScript error: Property 'X' does not exist on type 'Window'
I have added TS to my React/Redux app.
I use window object in my app like this:
componentDidMount() {
let FB = window.FB;
}
TS throws an error:
TypeScript error: Property 'FB' does not exist ...
- 30.2k
275
votes
19
answers
414k
views
npm ERR! code UNABLE_TO_GET_ISSUER_CERT_LOCALLY
I am trying all possible ways to create a React application. I have tried Maven, and now I am trying create-react-app from Facebook Incubators.
When I tried to run the command create-react-app my-app ...
- 7,779
244
votes
5
answers
169k
views
What does this "react-scripts eject" command do?
What does the npm run eject command do? I do understand what other commands do like start, build, test. But no idea about eject.
- 5,891
211
votes
16
answers
201k
views
How to create a React app directly in the current folder
I know I've done it before but I can't seem to find the answer anywhere. I want to run create-react-app without creating a whole other folder within the folder I'm already in. I believe it is just an ...
- 2,141
190
votes
17
answers
113k
views
'React' was used before it was defined
I am working with create-react-app + typescript + eslint application and during build have such error:
Line 1:8: 'React' was used before it was defined @typescript-eslint/no-use-before-define
Code ...
- 2,339
187
votes
22
answers
147k
views
Absolute paths (baseUrl) gives error: Cannot find module
I am setting a configuration to run my tests in a create-react-app + typescript app (from which I have ejected). I am using jest + enzyme. In my tsconfig.json I have set baseUrl='./src' so I can use ...
- 5,196
181
votes
3
answers
136k
views
What is public/manifest.json file in create-react-app?
I know that chrome extensions use 'manifest.json`, but here, it is used as something else as well.
contents -
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
...
- 2,852
179
votes
18
answers
321k
views
Use custom build output folder when using create-react-app
Facebook provides a create-react-app command to build react apps. When we run npm run build, we see output in /build folder.
npm run build
Builds the app for production to the build folder. ...
- 4,868
174
votes
7
answers
218k
views
Using "homepage" in package.json, without messing up paths for localhost
This question actually follows directly from my answer on a previous question.
I added a "homepage" to my package.json because it is a React app that I hosted on Github Pages. The output of npm run ...
- 11.9k
171
votes
5
answers
61k
views
How to disable open browser in CRA?
I've created a React app using create-react-app but whenever I start the dev server (using npm start), it opens up my browser. I want to make it so that it doesn't open my browser whenever I start my ...
- 1,973
169
votes
7
answers
146k
views
Get version number from package.json in React Redux (create-react-app)
OP EDIT: If anyone else comes across this: the app was created using create-react-app, which limits importing to within the src folder. However if you upgrade react-scripts to v1.0.11 it does let you ...
- 4,543
167
votes
13
answers
233k
views
How do I hide an API key in Create React App?
I made a weather app in Create React App (create-react-app). How do I hide the API key so that I can commit to GitHub?
Right now, the key is in App.js:
const API_KEY = "123456";
- 1,685
165
votes
7
answers
284k
views
How to set build .env variables when running create-react-app build script?
I'm using the following environment variable in my create-react-app:
console.log(process.env.REACT_APP_API_URL) // http://localhost:5555
It works when I run npm start by reading a .env file:
...
- 3,187
160
votes
4
answers
97k
views
How is ESLint integrated into Create React App?
When I run npx create-react-app some-name, a bare-bones React project is created for me.
When I then peek into package.json, there seems to be some evidence of ESLint being present, as there is this:
&...
- 6,712
159
votes
19
answers
102k
views
Line 0: Parsing error: Cannot read property 'map' of undefined
Currently starting up the server on my client side, the error above is what I have been
getting. I am using TypeScript, ReactJS, ESLint. I can't seem to go forward since this error
has been haunting ...
- 1,660
155
votes
4
answers
105k
views
What is the difference between Next.js and Create React App?
I'm trying to figure out the difference between Next.js and Create React App (CRA). I know both are there to make our life easier while developing our front-end applications using React.
After ...
- 13.4k
150
votes
37
answers
237k
views
Development server of create-react-app does not auto refresh
I am following a tutorial on React using create-react-app.
The application is created by create-react-app v1.3.0
create-react-app my-app
The dev server is run by
npm start
After changing the code ...
- 4,434
147
votes
5
answers
87k
views
Is there an option to show all test descriptions when I run jest tests?
I'm using jest and enzyme with my create-react-app project. When I run npm test, I get an output that shows the names of the test files that passed but I'd like the output to also include the names of ...
- 1,691
147
votes
1
answer
94k
views
Where's the connection between index.html and index.js in a Create-React-App application?
I'm starting to play with the Create React App, but I can't understand how the index.js is loaded inside index.html. This is the html code:
<!doctype html>
<html lang="en">
<...
- 9,243
146
votes
12
answers
130k
views
tslint says calls to console.log are not allowed - How do I allow this?
I just started using create-react-app with typescript
create-react-app my-app --scripts-version=react-scripts-ts
and the default tslint.json configuration does not allow console.log().
How can I (...
- 10.6k
145
votes
10
answers
175k
views
Home does not contain an export named Home
I was working with create-react-app and came across this issue where I get an error:
Home does not contain an export named Home.
Here's how I set up my App.js file:
import React, { Component } from '...
- 4,222
140
votes
42
answers
111k
views
create-react-app is not working since version 4.0.1
I tried installing create-react-app using npm i create-react-app, npx create-react-app new-app and npm init react-app new-app, but I keep getting this error message:
You are running create-react-app ...
- 1,401
139
votes
3
answers
43k
views
Running CRA Jest in non-interactive mode
Update: my use case is mainly to run tests at CI, but overriding default CRA Jest parameters is something I'm generally wondering about.
I'm running tests using the Jest, config that came with Create ...
- 17.1k
131
votes
26
answers
230k
views
create-react-app: how to use https instead of http?
I was wondering if anyone knows how to use https on dev for the 'create-react-app' environment. I can't see anything about that in the README or quick googling. I just want either the https://...
- 5,343
131
votes
14
answers
240k
views
Can't build create-react-app project with custom PUBLIC_URL
I'm trying
PUBLIC_URL=http://example.com npm run build
with a project built using the latest create-react-script.
However, the occurrences of %PUBLIC_URL% in public/index.html are replaced with an ...
- 1,541
130
votes
6
answers
225k
views
How to run build version using create-react-app?
So, I developed a small React application using create-react-app. (I have always made applications from scratch.)
Then, after I was kind of happy with it, I decided to run npm run build to make an ...
- 3,961
129
votes
11
answers
161k
views
Disable ESLint that create-react-app provides
create-react-app v3.0.0 is out. It supports TypeScript linting internally. (That's nice!) I think I understand the situation where TSLint is on, and am planning to replace it with ESLint, but it is ...
- 3,098
126
votes
7
answers
99k
views
Relative path in index.html after build
Hello i have a reactjs app, and I build my project with bellow command
npm build
Here is my package.json file:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
...
- 1,704
123
votes
2
answers
81k
views
What is the significance of browserslist in package.json created by create-react-app
I was asked this in an interview. I could not answer.
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
I can see that Its an array.
"not ie <=11" means will not ...
- 4,742
120
votes
17
answers
90k
views
Disable error overlay in development mode
Is there a way to disable the error overlay when running a create-react-app in development mode?
This is the overlay I'm talking about:
I'm asking this because im using error boundaries (React 16 ...
- 1,213
116
votes
21
answers
208k
views
'command not found: jest'
I have a test file like so: (I am using create-react-app)
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/Calculator';
import { getAction, getResult } from '...
- 5,679
108
votes
24
answers
331k
views
npm start error with create-react-app
I have a project who I didn't touch for 2 weeks. I take it back and now when I try to run npm start I got this error.
> react-scripts start
sh: react-scripts: command not found
npm ERR! Darwin ...
- 5,879
101
votes
9
answers
66k
views
How to avoid using relative path imports (/../../../redux/action/action1) in create-react-app
I've been using create-react-app package for creating a react website. I was using relative paths throughout my app for importing components, resources, redux etc. eg, import action from '../../../...
- 1,447
101
votes
23
answers
188k
views
How to open a create-react-app from another computer connected to the same network?
I am using create-react-app and hosting in its default port localhost:3000 and want to access this from another device on the same network.
I got the IP of my host's IP (using ifconfig) 192.168.0.5 ...
- 2,203
101
votes
5
answers
56k
views
Serving a front end created with create-react-app with Flask
I have a Flask back-end with API routes which are accessed by a React single page application created using create-react-app. When using the create-react-app dev server, my Flask back end works.
I ...
- 1,250
99
votes
6
answers
65k
views
Create React App: using environment variables in index.html
Is there a way to inject environment variables, e.g. REACT_APP_MY_API into the index.html file?
According to this, it can be done, but I can't seem to get it to work.
.env
REACT_APP_MY_API=https:/...
- 17.1k
99
votes
6
answers
114k
views
Best way to polyfill ES6 features in React app that uses create-react-app
I've been testing my React.js application on internet explorer, and finding that some ES6/7 code like Array.prototype.includes() breaks it.
I'm using create-react-app, and apparently they've chosen ...
- 5,174