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"
]
}
}
Related
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
Failed to compile
./src/index.js 1:39
Module parse failed: Unexpected token (1:39)
File was processed with these loaders:
./node_modules/#pmmmwh/react-refresh-webpack-plugin/loader/index.js
./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
$RefreshRuntime$ = require('C:/Users/I'm-cx0140/Desktop/dreact/node_modules/react-refresh/runtime.js');
| $RefreshSetup$(module.id);
|
This error occurred during the build time and cannot be dismiss
my package.json
{
"name": "myapp",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.13.0",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "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"
]
}
}
enter code here
{
"name": "myapp",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.13.0",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "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"
]
}
}
Removing the " ' " from my foldername work for me. change I'm-cx0140 to something like Im-cx0140
The ' character in your user name (I'm-cx0140) can trigger this issue, create your project in another folder.
I am trying to render static HTML inside an Azure function from React-components with the help of: ReactDOMServer.renderToStaticMarkup(<HelloWorldPage />)
where <HelloWorldPage /> is a React-component.
However, I receive SyntaxError: Unexpected identifier errors both on imports and use of React components inside my Azure function although i have imported react and react-dom.
My package.json looks like:
{
"name": "experimental",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.9",
"#testing-library/react": "^11.2.5",
"#testing-library/user-event": "^12.8.1",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.0"
},
"scripts": {
"start": "react-scripts start",
"build": "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"
]
}
}
I am certain the solution to this is fairly simple, which makes it extra frustrating. But I do not know where to start. I would be infinitely grateful if someone could point me in the right direction. Thanks!
React is installed properly and everything else works, except when I try to run "npm start" in the terminal, it gives me the following error.
Here's my package.json code:
{
"name": "r3-ui",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.6",
"#testing-library/react": "^11.2.2",
"#testing-library/user-event": "^12.2.2",
"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"
},
"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"
]
}
}
Do not use & when naming the directory on Windows. Rename UI & Web Design into UI_Web_Design. Anything after the & is treated as a command.
After changing the name of the directory run npm start.
I have been trying to install React on my pc using both the methods npx and npm but even then my terminal (VSCode) is throwing this error. I am unable to start my custom react app.
I have checked other responses but I was not satisfied.
My current node version is 12.16.2
My current npm version is 6.14.8
My package.json file is :
"name": "myapp",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3"
},
"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"
]
}
}
I have been stuck for hours now. Any help is very much appreciated.