I have a react project built with create-react-app. Everything is working fine, except that every few minutes it decides to open up http://localhost:3000/ in a new tab in the browser. This happens when I haven't made any changes to the code, and I already have http://localhost:3000/ open in another tab. How can I make this stop happening? I haven't been able to find any solutions.
I'm on Windows 10, WSL2.
I start up the project using npm start. This is my package.json:
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {...},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Thank you!
Related
I'm trying to build my react application, using Visual Studio Code, by tyiping
yarn run build
But the error that I get is the following
ERROR in ./src/index.js 8:4
Module parse failed: Unexpected token (8:4)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| ReactDOM.render(
> <App />,
| document.getElementById('root')
| );
As requested in the answer, here follows the code of my package.json (I removed some of the dependencies otherwise there was too much code for stack overflow in the question)
{
"name": "react-portfolio",
"homepage": "https://StonesCutter.github.io/react-portfolio",
"version": "0.1.0",
"private": true,
"dependencies": {
...
"yarn": "^1.22.19"
...
},
"scripts": {
"start": "react-scripts start",
"test": "react-scripts test",
"eject": "react-scripts eject",
"predeploy": "yarn run build",
"deploy": "gh-pages -d build",
"build": "webpack"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^4.0.0",
"webpack-cli": "^4.10.0"
}
}
Do you know how could I fix this problem?
I want to run a backend server along with frontend on same server. So I build the frontend and provided a build path but this is not working.
Here is my npm script file.
{
"name": "nasa-fe",
"version": "1.0.0",
"private": true,
"dependencies": {
"arwes": "^1.0.0-alpha.5",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.3"
},
"scripts": {
"start": "react-scripts start",
"build": "BUILD_PATH=../server/public react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
When I run build command it's showing 'BUILD_PATH' is not recognized as an internal or external command. How do I fix this.
BUILD_PATH is an environment variable, just like PORT. On Windows, with the default shell, the way we set our BUILD_PATH variable is:
set BUILD_PATH=../server/public&& react-scripts build
Here is my updated script file.
{
"name": "nasa-fe",
"version": "1.0.0",
"private": true,
"dependencies": {
"arwes": "^1.0.0-alpha.5",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.3"
},
"scripts": {
"start": "react-scripts start",
"build": "set BUILD_PATH=../server/public&& react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
package.json
{
"name": "test",
"version": "1.0.0",
"private": true,
"dependencies": {
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.1",
"web-vitals": "^0.2.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
error
Support for the experimental syntax 'jsx' isn't currently enabled
after I push the latest code in my GitHub account, then I try to install my GitHub code into another react application when I do npm start I`m facing this
I tried to update my version of create-react-app by doing this:
If you've previously installed create-react-app globally via npm
install -g create-react-app, we recommend you uninstall the package
using npm uninstall -g create-react-app to ensure that npx always uses
the latest version.
But now, when I run npm start, i get an error message:
missing script: start
But in the package.json from my app, i found the start script:
{
"name": "dropzone-montessori",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.2.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Anybody knows what's happening?
Using CRA, server is opened after about 2 minutes!
Uninstall create-react-app
Uninstall node(npm), yarn clearly
Install node by using nvm
Install yarn using npm
npx create-react-app test
yarn test
same result...
node version: v12.10.0
yarn version: 1.17.3
npx version: 6.10.3
When yarn start,
Starting the development server...
after about 2 minutes...server open!
Before 2 week, It was so fast!
(+ macOS version: 10.14.2, 2015 early, RAM 8G)
How can I speed up my server opening?
It's CRA package.json
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.9.0",
"react-dom": "^16.9.0",
"react-scripts": "3.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}