I'm trying to make a multiplayer game using the Networked-Aframe library with aframe-react. The big roadblock I've run into is I can't simultaneously run:
react-scripts start
to run react and
node ./src/vendor/easyrtc-server.js
to run my server.
Maybe create a production build of my react app, then run the server?
How do I get these two working together?
My easyrtc-server.js: https://pastebin.com/PJ0UchSi
You can add new scripts to your package.json file to run different commands.
Example
{
"name": "someapp",
"version": "0.0.1",
"private": true,
"dependencies": {
// some dependecies
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"custombuild": "npm build && node ./src/vendor/easyrtc-server.js"
}
}
Then when you can run,
npm custombuild
This command will first build your app and then start your server.
Related
When we develop web app with VS code-server, the default method to preview the result URL is
http://{yoursite}/proxy/3000
However, it does not work with react development.
When we follow the official tutorial to start a react app, all the static resources inside the html template always redirected to the index.html
e.g index.html is returned instead of /static/js/bundle.js
To resolve this problem, in the project root directory, open:
package.json
In script block,change the start property
from:
"start": "react-scripts start"
to
"start" : "PUBLIC_URL='/absproxy/3000' react-scripts start"
:
"scripts": {
"start": "PUBLIC_URL='/absproxy/3000/' react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
This is also written in below documentation.
https://coder.com/docs/code-server/latest/guide#stripping-proxyport-from-the-request-path
for those who has an another app running on port 3000, just simply do these little steps:
optional:
export PORT=3001
and then add in package.json
"scripts": {
"start": "PUBLIC_URL='/absproxy/3001/' react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
if you are running a Nextjs App you should do provide a basePath:
go to next.confing.js file and just add this line of code:
basePath:"/absproxy/3002"
I have a basic folder structure in React by my friend. At first, I run the npm install.
Then, I run the following command to start the server. But could not work out.
Could you please help me and thanks in advance?
Below is my package.json file
{
"private": true,
"dependencies": {
"todomvc-app-css": "^2.0.0",
"todomvc-common": "^1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
}
*Below is my folder structure *
enter image description here
Now I am trying to run the npm run start. But it couldn't work. It says that
In recent react app I install nodemon globally and modified package.json to add dev command like this:
"scripts": {
"start": "react-scripts start",
"dev": "nodemon ./app.js",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
I start the app like this npm run dev but problem in any changes the development server start again opening new tab. How I make only current tab refreshed ?
Why not simply use npm start?
react-scripts start sets up the development environment and starts a server, as well as hot module reloading. Read more here.
I want to deploy my react app to production (using heroku). When the app is deployed, React dev tools indicates that my app is running in development mode
I pushed the application to heroku : https://lesamisdhubert.herokuapp.com/
I tried to set an environment variable :
heroku config:set NODE_ENV=production
however, when I console.log(process.env.NODE_ENV), It returns development
I also tried npm run build before pushing to production but it hasn't worked
here are my scripts in the package.json file :
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
however console.log('node env --->', process.env.NODE_ENV); returns 'development'
Does anybody knows how I can set my react app into production mode ? Is this a problem with npm run build ?
Thanks a lot, I really don't understand where this can come from ...
I replaced in package.json :
"scripts": {
"dev": "react-scripts start",
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
}
I also created a new heroku app and it seems to work
When configuring enviroment vars in heroku you have to append REACT_APP_VARIABLENAME and then set its value otherwise you can't have access to the env variable.
take a look at: https://github.com/mars/create-react-app-buildpack#compile-time-configuration
you can do this in the heroku client
I would like to configure npm test in my server. when I run npm test, it invokes react-scripts test which triggers a prompt window ( attached screen ). How do I avoid the prompt and run all testcases in the server.
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"lint": "./node_modules/.bin/eslint ."
},
To run all the tests, use "test": "react-scripts test --watchAll=false"
If you pass CI=true, it will run once without setting up that prompt as described at https://create-react-app.dev/docs/running-tests/#linux-macos-bash:
CI=true npm test
When you want to run all tests you can use npm test --watchAll
You can just update your package.json and in the scripts section update the test one with just "test": "jest"
It should run every test file that it can find in your project