Im trying to deploy angular app 13.2
ng build
This command generated dist folder
//Install express server
const express = require('express');
const path = require('path');
const app = express();
// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist'));
app.get('/*', function(req,res) {
res.sendFile(path.join(__dirname+'/dist/index.html'));
});
// Start the app by listening on the default Heroku port
app.listen(8080,'127.0.0.1');
Using above started server, but finding this error in browser console
Any help...
Related
I am deploying a Node.js Express app to a VPS by Render. When I run the app on my local machine, the npm start command does a great job of serving my file when I point the browser to localhost:3001. However, after I deploy, the base directory '/' returns "Not found". I have to point my browser to example.onrender.com/public/index.html.
How do I make sure that example.onrender.com/ routes the request to public/index.html?
Thank you!
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', function(req, res) {
res.render('index.html');
});
app.listen(3001);
Actually just had to change "Publish Directory" settings in Render to ./public
I'm fairly new to Gatsby and React, but I'm looking to deploy the static assets generated by a Gatsby build on an Express server. If I import the Public folder generated by 'gatsby build' into the server directory, and use the following code:
var express = require('express');
var path = require('path');
const app = express();
app.set('view engine', 'html');
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', function(req,res){
res.render('./public/index')
});
app.listen(8080, function(){
console.log("Running on port 8080")
});
The homepage is just blank. My question is, how can I configure my Express app and Gatsby (and therefore React and React Router) so that the Gatsby site will run through my Express app?
I tried to connect angular front end with nodejs earlier I ran ng build on public folder of app and then ran localhost:3000. No error was given on compilation but app is broken now. Now do I achieve it? My folder structure is like this
client
public
app.js
client contains all angular code, public contains compiled code of angular
till I have also changed output path to ../public in angular.json.
And here is my app.js:
var express = require('express');
var path= require('path');
var cors = require('cors');
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var passport = require('passport');
var app= express();
var port = 3000;
app.set('view engine','ejs');
//app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, '/views'));
app.use(express.static(path.join(__dirname, 'public')));
app.use('/api', routesApi);
app.get('/', (req,res) => {
res.send("Invalid page");
});
app.listen(port, () => {
console.log(`Starting the server at port ${port}`);
});
I think up to now you have a build of a running angular application and perfectly running node.js server.
What you have to do is host your client application. Follow the following steps to get this working.
Install http-server globally on your machine using npm install http-server -g command
Then run http-server /path/to/your/dist/folder. (You should get a dist folder after running ng build --prod)
Then run your node.js server.
And open your browser and go to http://localhost:8080
I am trying to deploy my angular application on windows server for that i am using the express server .
I have configured my server.js file like this:
var express = require('express');
var app = express();
const path = require('path');
app.use(express.static(__dirname + '/dist'));
app.listen(process.env.PORT || 4200);
app.get('*/', function(req,res){
res.sendFile(path.join(__dirname + '/dist/index.html'));
})
console.log('App is listing on ' + 4200);
Also, i have deployed the content that was produced using the ng build command inside dist.
I can successfully able to access the application when i enter http://localhost:4200 in my browser.
But, the problem what i am facing here is the proxy server is not getting created which was used to be created when i was using :
"start": "ng serve --proxy-config local-proxy.config.json",
But, now since i am not calling ng serve instead of this i am calling node server.js which is serving my application on server.
"start": "node server.js --proxy-config local-proxy.config.json",
Can someone can help me please.
I generated an Angular2 project by using Angular-CLI. This is the front-end side. Now I'd like to add an Express server but I don't know how exactly should I do that.
Should I add an express app.js file into generated by Angualar-CLI "src" directory? I've tried it and what's next? To start Angular-CLI project, I need to type ng serve in CMD. To start server, I need to type node app.js.
Example of app.js
var express = require('express'),
path = require('path'),
favicon = require('serve-favicon'),
logger = require('morgan'),
cookieParser = require('cookie-parser'),
bodyParser = require('body-parser');
var app = express();
app.get('*', function(req, res) {
res.sendFile(path.join(__dirname, 'index.html'));
});
app.listen("8080", function() {
console.log("at 8080 port");
});
module.exports = app;
Well... Angular2 doesn't work when I start app by node app.js. ng serve builds all files and in mysterious for me way puts it all together.
Maybe I should create front-end and back-end completely separated? But what then? Use technology like Nginx for reverse proxy?