nodejs bootstrap project works local only - javascript

Ive been trying out different things, and looking up various ways to solve it, but I'm in need of some extra hints to make this work.
I have a working NodeJS Bootstrap project with Gulp. My website functions locally.
So in my project I have the fiollowing files (among other folders) :
gulpfile.js
index.html
package.json
When I locally run my project via 'gulp dev' everything seems perfect. On Heroku after deploying it gives me the error: npm ERR! missing script: start
This makes sense, because indeed my package.json doesn't have a start script. How can this work on local?
any leads?
thanks

node.js file
name it index.js
first before you start move all the current files into a new folder called public in the parent folder above public create the file index.js
once you are in the parent folder above public run this in the command line for the directory where you created the index.js file
npm i express --save
this will install a mini framework for node.js and save it to the project.json config
for the index.js file this is the content
/// START
var express = require('express');
var path = require('path')
var app = express();
var port = process.env.PORT || 80;
// this allows the files to be visible without having to type in the
// index.html for the url simply do / and you'll get the url
app.use(express.static(path.join(__dirname, 'public'),{
extensions: ['html']}
));
app.listen(port);
///END
you need to make sure that the index.js (node file) is in 1 folder above the rest of the project. The project should be in a folder called public in this case
before you upload this to the heroku get it working on your local machine
you need to run node index.js if you get any errors we can work through them but this is a really generic static serving node.js server.
last thing you need to do is go into the project.json file and add the following you can add it right above "title" in this case so it's easy to find later
"scripts": {
"start": "node index.js"
}

If the code is client-side, you should serve up the bundled HTML/CSS/JS in a static server. Doesn't make sense to run node just to serve up your static assets.

Ive never used heroku but for my node application that is hosted in AWS i had to add a start script to my package.json
"scripts": {
"start": "set NODE_ENV=production nodemon app.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
You can use similar node start commands if youre not using nodemon.

Related

I have a react js and node js app and cant auto start index.js (the backend file)

I have 2 main files.
App.js
index.js
my target: Deploy the website.
the problem: index.js(backend file) not running when deployed.
solution: automatically run the command node index.js.
but the thing is...
I tried implementing stuff in json and its not working...
"start": "set PORT=3001 && react-scripts start && node index.js"
such as this line...

Netlify deployment not displaying page content

I have simple Javascript project that builds correctly locally, and I get this result
However, when I deploy it on netlify or run netlify deploy locally I get the image below from the draft URL
In my netlify.toml file I have the following configuration
[build]
command = "npm run build"
publish = "dist"
[dev]
command = "yarn start"
targetPort = 3000
port = 8888
publish = "dist"
What could be the issue leading to that problem?
I needed to remove the homepage key and value from the package.json because React uses this to build for relative paths.
Also I needed to delete publicPath key from webpack.config.js
After those changes, the build worked and the deployment was successfull

Run webpack dev server while using angular cli serve script

I'm new to angular cli and webpack. In my project I have a webpack config file which among other configurations, it indicates that a merge file plugin (MergeJsonWebpackPlugin) should run for merging certain files and putting them on an output file somewhere else.
My problem is that when running webpack this is done, but those output files are stored somewhere in virtual memory. For what I've read, this is the normal behavior until you properly build you app for production in which case those outfile will be written in disk.
My app of course, tries to find those output files on the assets folder for using them inside the app itself. I've used another plugin (WriteFilePlugin) so as to been able to write the files in disk while running the webpack dev server, and this works great.
Now, For been able to handle this now I have a dedicated angular cli script in my package.json file
....
"scripts": {
"ng": "ng",
"start": "ng serve --port 9978",
"build": "ng build",
....
"custom": "webpack-dev-server --inline --progress --colors"
}
...
So, I have to run "npm custom" in order to have my files written in disk. Then I have to run "npm start" to serve my application and use those files. If for some reason I update my source files which should be merged, then I have to stop my start script and run the custom script for the webpack dev server all over again
Is there a way to include this automatically when running the start script via angular cli?
I've been reading that when you run "ng serve" what happens behind the scenes is:
Angular CLI loads its configuration from .angular-cli.json
Angular CLI runs Webpack to build and bundle all JavaScript and CSS code
Angular CLI starts Webpack dev server to preview the result on localhost:4200.
...because it includes LiveReload support, the process actively watches your src directory for file changes. When a file change is detected, step 2 is repeated and a notification is sent to your browser so it can refresh automatically.
On point 3 I would expect my merged files to be generated and store inside the assets folder but this is not happening (as it does when running "npm custom"), neither the update of this merged files whenever I update them.
Am I missing something? Would this be possible to do? Thanks in advance!

How to build expressjs, reacjs running on electronjs

So, i tried to make Electron app to run Express as the server and React as client. My step is basic one i think, first i generate electron with electron boilerplate and then inside the project that got generated, i generate express into server folder using boilerplate also, and inside the same electron project folder i generate react with create-react-app into client folder.
Here is my project folder structure:
client folder from create-react-app, server folder from express boilerplate.
In development i run express at port 30001 and react at port 3000. And using this script to run them :
"start": "concurrently \"cd ./server && cross-env PORT=3001 npm start\" \"cd ./client && cross-env BROWSER=none npm start\" \"wait-on http://localhost:3000 && electron .\"",
But, from this point i don't know a slight clue of how to build this.
Note: I have tried another react-electron boilerplate, and some just too much for me or some can't import node modules directly to reactjs i don't know why. I am using expressjs as bridge between my react and node modules. Any insight on better implementation would be greatly appreciated.

setting up app.js using git bash error

I am a beginner for this one and I want to learn from the start. I want to set up app.js in my sp-node-mysql directory to use mysql through javascript. But I can't get through.
Here is the line of code: var mysql = require("mysql");
and the error: bash: syntax error near unexpected token '('
I think there is nothing wrong with the line of code. But it is still showing this error message.
To get started do the following:
In your projects root directory type the following into the command line:
"npm init"
"npm install mysql --save"
This will create a package.json file and a node_modules folder in your projects root directory. Within the node_modules folder you will have the mysql module installed. Nothing else needs to be done with this.
Then in the project root directory create a file called app.js.
Within app.js write the following code.
var mysql = require('mysql')
console.log('No errors during require')
process.exit()
Then execute your node program by typing "node app" or "node app.js" on the command line within your projects root folder.
Let me know if that works for you.

Categories

Resources