I want to try the serve package with a React App by doing the following step:
npm install serve --s
then replace the npm start command in package.json like this:
scripts": {
"start": "serve -s build",
"build": "react-scripts build",
"test": "react-scripts test",
...
},
and then I run npm start i got the error in the console "Uncaught SyntaxError: Unexpected token '<'" etc
however if I uninstall serve --s and put back the package.json like this :
scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
...
},
and then run npm start again it work fine on my local machine, so i think i am doing something wrong in the process and i would like to know why I have issue with the serve package.
Looks like you haven't built your /build folder with app bundle. It must be like this:
npm start - to run and edit code
npm run build - to build a bundle(creates/rebuild a /build folder)
serve -s build - serve/start the /build folder
Related
I am new to react and setting up environment variables for my project. Here is what I did..
added .env-cmdrc.json as follows
{
"development":{
"REACT_APP_BASE_URL": "https://servername:port/"
},
"staging":{
"REACT_APP_BASE_URL": "http://servername:port/"
},
"local":{
"REACT_APP_BASE_URL": "http://localhost:port/"
}
}
installed npm
npm install env-cmd or npm install -g env-cmd
edited package.json as follows:
"start:development": "env-cmd -e development react-scripts start",
"start:staging": "env-cmd -e staging react-scripts start",
"start:local": "env-cmd -e local react-scripts start",
"build:development": "env-cmd -e development react-scripts build",
"build:staging": "env-cmd -e staging react-scripts build",
tried - npm run start:development
was giving me env-cmd error
again ran
npm install env-cmd
Now tried - npm run start:development
Failed to find .rc file at default paths: [./.env-cmdrc,./.env-cmdrc.js,./.env-cmdrc.json] at getRCFile
I am doing it first time and would appreciate any help..what am I missing here..
I tried your code, but it works well.
Check your code, ensure the location of your config file .env-cmdrc.json, it should be placed under root dict of your project (the same level with package.json)
I would suggest using dotenv package instead of env-cmd.
install the package - npm i dotenv
Create a environment file in your root directory - .env
Declare a variable - REACT_APP_URL=http://localhost/....
Use the variable - process.env.REACT_APP_URL
In order to start the React application you need to check your package.json file and make sure it contains something like this:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
If that's in place you can run the following command: npm start
Now you can start coding :)
My packages.json file has the following scripts:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
I perform a build with: npm run build
The result goes into the folder ./build where the dir hierarchy is as follows:
- assets
- static
- assets-manifest.json
- index.html
- manifest.json
- service-worker.js
- service-worker.js.map
If I'm in the build dir, how can I run the app? npm run start doesn't work because it looks for packages.json.
Ionic serve doesn't either since under the hood it still uses npm.
How can I run the app after it's built?
Starting a project with react.js, I create the project to write npm start a project I get the error, fuy to the address that says there, but I do not know how to fix it because what I ask help you the error is this: npm Err! Missing script: start. Npm Err! A complete log of this run can be found in npm Err! C:-Users-Sanvicente-Appdata-Roaming-npm-cache-_logs-2020-08-27t20_09_40_583z-debug.log. (I'm starting with react)enter image description here
If you have created react app using npx create-react-app <app_name> command then you should find a package.json file inside the <app_name> folder. Ensure that that file has the following:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
I have a react application that connect to micro services. I have different micro services urls per environment. I therefore have multiple env files: .env, .env-develoment-local, env-development,...
When I start the app locally, the app pick up the setting in the .env.development-local which is expecetd.
When I do npm run build I noticed that since it creating a production build, it picks up the .env file.
My question is how can configure the build such a way that it picks other .env files like .env.development or .env.qa, etc... ?
I was able to get this working using https://github.com/toddbluhm/env-cmd
I did the following:
npm install --save-dev env-cmd
Then updated package.json accordingly:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build:stage": "env-cmd -f ./.env.stage npm run-script build"
}
Then run the following command:
npm run build:stage
I've got a node project with a create-react-app project in a folder called client.
It's setup on Heroku and deploys and works (functionaly) using git push heroku master but none of the styling is active and it's using the wrong fonts.
It all works on localhost.
In the project package.json I have
"heroku-postbuild": "cd client && npm install && npm run build"
and in client package.json
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Cannot find anything wrong in Heroku setup or logs, or any documentation, at a bit of a loss where to start even looking
Included the css file in index.html