I have an application that is a combination of a node middleware server and a next.js front end gui with react components. It was running ok, but then, when I tried to build it in production mode, I keep getting the following error:
UnhandledPromiseRejectionWarning: Error: Cannot find module 'C:\Users\mgardner\workspace\qa-tool-backoffice\.next\prerender-manifest.json'
Require stack:
- C:\Users\mgardner\workspace\qa-tool-backoffice\node_modules\next\dist\next-server\server\next-server.js
- C:\Users\mgardner\workspace\qa-tool-backoffice\node_modules\next\dist\server\next.js
- C:\Users\mgardner\workspace\qa-tool-backoffice\server.js
I'm a little confused as to how to get the next front end to run concurrently with the node/express server. Here's my package.json file:
{
"name": "ibo-ui",
"version": "0.1.0",
"private": true,
"scripts": {
"mockdb": "json-server --watch public/mockdb.json --port 3001",
"dev": "concurrently --kill-others \"json-server --watch public/mockdb.json --port 3001\" \"npm start\"",
"build": "next build",
"start": "node server.js && next start"
},
The reason this was happening was because my next build process was failing. It was failing because I had some old react functions in the public pages folder.
The issue was that my pages not generated at build time in Nextjs correctly due my path included not correctly try to check your page collecting data fully and pages generated correctly.
Related
I am trying to run socket io server in my codesandbox project with my react app at the same time but It doesn't seem to work.
my package is containing the following:
"main": "src/index.tsx",
"scripts": {
"start": "concurrently \"npm run server\" \"react-scripts start\"",
"server": "nodemon --exec 'ts-node' server/index.ts localhost 8080"
},
I do no think my scripts are being detected by the codesandbox because I have tried deleting everything from them and my react app is working - without the server part. Can someone explain how does codesandbox handle those stuff and if you have an example how to run react + server in the same sandbox.
I got very confused when it came to deploying my project, i used nodejs and mongodb for the backend.
So when i wanted to deploy the project, i didn't know how to build it. I have read about static site generation and server side rendering, but i dont know which one to choose.
I ran a npm run build which disabled the api routes (which is exactly what i dont want to happen) in my project with this configuration:
"scripts": {
"dev": "next dev",
"build": "next build && next export",
"start": "next start",
"lint": "next lint"
}
PS: i didnt use getServerSideProps or getStaticProps or anything because my website doesn't fetch any data at build time.
I have recently started working on nextjs framework and I have created an index.js document inside pages folder. I wanted to implement social login authentication and found for some reasons I need to run next js in https mode.
Can anybody tell me how can I do that in dev machine.
Here is my error message
error message
and here is my package.json scripts
"scripts": {
"dev": "next -p 3001",
"build": "next build",
"start": "next start",
},
This article on freeCodeCamp looks promising :
https://www.freecodecamp.org/news/how-to-get-https-working-on-your-local-development-environment-in-5-minutes-7af615770eec/
Using Hyperledger Fabric Composer I created a simple application.
However, when I try to interact with the application (which is served at http://localhost:4200), I keep getting the following error message:
Error: 404 - Could not find API route. Please check your available APIs.
This error message appears whatever I want to do (create new Participant/Asset, submit a transaction, ...)
I checked whether the error message had something to do with the application I created. So I also deployed another application I downloaded from the Internet. Again, the same error message appeared when I tried to interact with the UI.
**********************************************************
Here's the long story:
After I had finished writing the code, I took the usual steps to obtain an Angular Web App:
Inside the folder of the app ("my_app"), I created a folder called "dist".
Inside folder "dist" I ran the following commands:
composer archive create -t dir -n ../
composer network install --archiveFile my_app#0.0.1.bna --card PeerAdmin#hlfv1
composer network start --networkName my_app --networkVersion 0.0.1 --card PeerAdmin#hlfv1 --networkAdmin admin --networkAdminEnrollSecret adminpw
composer card import -f admin#my_app.card
//start rest-server:
composer-rest-server
yo hyperledger-composer
After the last command I chose (from the menu) the option to create an "angular" application based on the business network "my_app".
A folder containing the angular-application was created (name of the folder: "angular").
Inside folder "angular", I ran the following command:
ng serve
Some output on the command line was created, among others, the following line:
** NG Live Development Server is running on http://localhost:4200 **
When I went to address http://localhost:4200 everything looked fine at first.
However, whenever I click on any of the buttons in the UI (e.g. on "Add Participant"), I get the following error message:
Error: 404 - Could not find API route. Please check your available APIs.
I found the solution:
using
"npm start"
instead of
"ng serve"
avoids the problem.
FYI. There is a tutorial that shows use of the Composer Angular generator incl the npm startsequence.
I had the same issue and got the same error messgae. So i recreated the angular application using the yo hyperledger-composer tool but this time instead of choosing "Connect to existing REST API" I chose "Create new REST API" and then it connected fine on localhost:4200 while the rest server still ran on port 3000.
I just ran into this problem with version 0.20 of the Composer CLI tools. I solved the issue by editing the following in the /package.json file:
The "start" entry originally had "0.0.0.0" for the host value -
"scripts": {
"ng": "ng",
"build": "ng build",
"prepack": "npm run build",
"start": "ng serve --proxy-config proxy.conf.js --host 0.0.0.0",
"lint": "tslint \"src/**/*.ts\"",
"test": "ng test --watch false",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
}
I changed that to "localhost" -
"scripts": {
"ng": "ng",
"build": "ng build",
"prepack": "npm run build",
"start": "ng serve --proxy-config proxy.conf.js --host localhost",
"lint": "tslint \"src/**/*.ts\"",
"test": "ng test --watch false",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
}
Everything worked after restarting the Angular app with the new settings.
I also encountered this error, I resolved it by running the composer and the angular app as a background process.
I installed the forever package to run the two as a background process.
Then just killed the process if you're not gonna use it.
I'm just starting the react.js tutorial, I've downloaded the files and then it mentions:
"Follow your progress by opening http://localhost:3000 in your browser (after starting the server). "
I know this may sound stupid, (bear with me since I'm a beginner with React) but how do I start the server in this instance?
Thanks.
Marc
Pretty solid chance it's npm start from the project root.
Properly packaged modules will have some node scripts configured in package.json. It's customary to use start as the script to run the dev environment, though some might use build, dev, or other names.
Here's official installation process: link, and officially recommended tutorials
# install react cli
npm install -g create-react-app
# create app
create-react-app my-react-app-name
# go to project folder
cd my-react-app-name
# install dependencies
npm install
# start live server
npm start
output:
$ You can now view my-react-app-name in the browser.
$ Local: http://localhost:3000/
$ On Your Network: http://192.168.0.105:3000/
$ Note that the development build is not optimized.
$ To create a production build, use npm build.
You can run any one of the below mentioned commands to start the node server for your ReactJS application:
npm run-script start
npm run start
npm start
All the above commands are equivalent but people prefer the third one as it is the shortest to type on keyboard.
The start parameter in these commands maps to the start key present under scripts configuration present in package.json file of any ReactJS application. Here is a sample package.json file of my hello-world application:
{
"name": "hello-world",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^15.4.2",
"react-dom": "^15.4.2"
},
"devDependencies": {
"react-scripts": "0.9.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
You can see that react-scripts start is written in front of start key. So react-scripts start command will get fired when we run any of the three commands which I had enlisted in the beginning e.g. npm start.
I used Node to run the server. The steps I followed are:
I downloaded the zip package from the Running a server section
here
I had the link open: http://localhost:3000/
I opened up Node.js Command Prompt and navigated to the downloaded
zip project. From Node example here:
Just type the commands in the example:
First npm install and then
node server.js.
See the screen shot below:
When I refresh the localhost web page I see the following:
Sounds like you're following the official React tutorial, in which case the instructions to start the various included server implementations are here.