[MEAN Stack:当Angular位于Node文件夹中时,如何从Node启动Angular
我有一个MEAN堆栈应用程序,其中将Node安装在名为'myApp'的文件夹中。而且,我的Angular安装位于“ myApp”文件夹中,并称为“ Angular-src”。这是基本结构。因此,它可以在本地计算机上完美运行。对于Node,我在命令窗口上使用“ nodemon”,在另一个命令窗口上使用Angular的“ ng serve”。
但是,当我将其托管在Heroku上时,我开始遇到问题。我按照说明进行操作,即为Prod构建Angular应用程序,连接MongoDB,进行了部署,然后在浏览器中查看时,它指示我的Node服务器运行正常。但没有任何角度位运行的迹象。我在网上浏览了很多内容,但没有明确的答案。
我认为这与“脚本”部分中的“ package.json”文件有关。我有两个“ package.json”文件;一个在Node的“ myApp”文件夹中,另一个在“ Angular-src”文件夹中。这些是详细信息:
(1)节点文件夹中的“ package.json”-
{
"name": "-----",
"version": "0.0.0",
"description": "-----",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app"
},
"dependencies": {
"express": "~4.17.1",
"mongoose": "~5.6.0",
"cors": "~2.8.5",
"body-parser": "~1.19.0"
},
"author": "Harsha W. & Sujeewa B.",
"license": "ISC"
}
[(2)'package.json'在angular-src文件夹中(长文件被截断)-
{
"name": "angular-src",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "node server.js",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"heroku-postbuild": "ng build --prod",
"e2e": "ng e2e"
},
"private": true,
"dependencies": { ...
((3)我的app.js在Node文件夹中-
const express = require('express');
const mongoose = require('mongoose');
const cors = require('cors');
const bodyParser = require('body-parser');
const dbConfig = require('./config/database');
const http = require('http');
const fs = require('fs');
// Connecting with mongo db
mongoose.Promise = global.Promise;
mongoose.connect(dbConfig.database, {
useNewUrlParser: true
}).then(() => {
console.log('Database sucessfully connected')
},
error => {
console.log('Database could not connected: ' + error)
}
)
mongoose.set('useFindAndModify', false);
// Setting up port with express js
const coursesRoute = require('./controllers/courses.route');
/** other routes I have removed to unclutter the code **/
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: false
}));
app.use(cors())
app.use('/api/course', coursesRoute);
app.get('/', (req, res) => {
res.send("Hello HTTPS!")
})
// port
const port = process.env.PORT || 3000;
http.createServer(app).listen( port, () => {
console.log('Listening on port ' + port);
});
**我需要知道的是,当我的文件夹结构如上时,如何从Node服务Angular。
回答如下:我认为您正在将源代码部署到heroku而不是构建版本。现在,您的angular
服务器在开发中时就在4200
上运行,但是一旦将其部署在Heroku
上即可。您将只能使用一个端口(由heroku分配)。
构建角度应用程序的命令为ng build
,但不要只是去运行此命令(了解它)。这将占用所有组件并在HTML files
之类的文件夹中构建几个文件,您可以依次部署。
阅读有关Deploying Angular App。 youtube上有各种教程,您可以在其中找到如何在云上部署MEAN Stack应用程序。
[MEAN Stack:当Angular位于Node文件夹中时,如何从Node启动Angular
我有一个MEAN堆栈应用程序,其中将Node安装在名为'myApp'的文件夹中。而且,我的Angular安装位于“ myApp”文件夹中,并称为“ Angular-src”。这是基本结构。因此,它可以在本地计算机上完美运行。对于Node,我在命令窗口上使用“ nodemon”,在另一个命令窗口上使用Angular的“ ng serve”。
但是,当我将其托管在Heroku上时,我开始遇到问题。我按照说明进行操作,即为Prod构建Angular应用程序,连接MongoDB,进行了部署,然后在浏览器中查看时,它指示我的Node服务器运行正常。但没有任何角度位运行的迹象。我在网上浏览了很多内容,但没有明确的答案。
我认为这与“脚本”部分中的“ package.json”文件有关。我有两个“ package.json”文件;一个在Node的“ myApp”文件夹中,另一个在“ Angular-src”文件夹中。这些是详细信息:
(1)节点文件夹中的“ package.json”-
{
"name": "-----",
"version": "0.0.0",
"description": "-----",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app"
},
"dependencies": {
"express": "~4.17.1",
"mongoose": "~5.6.0",
"cors": "~2.8.5",
"body-parser": "~1.19.0"
},
"author": "Harsha W. & Sujeewa B.",
"license": "ISC"
}
[(2)'package.json'在angular-src文件夹中(长文件被截断)-
{
"name": "angular-src",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "node server.js",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"heroku-postbuild": "ng build --prod",
"e2e": "ng e2e"
},
"private": true,
"dependencies": { ...
((3)我的app.js在Node文件夹中-
const express = require('express');
const mongoose = require('mongoose');
const cors = require('cors');
const bodyParser = require('body-parser');
const dbConfig = require('./config/database');
const http = require('http');
const fs = require('fs');
// Connecting with mongo db
mongoose.Promise = global.Promise;
mongoose.connect(dbConfig.database, {
useNewUrlParser: true
}).then(() => {
console.log('Database sucessfully connected')
},
error => {
console.log('Database could not connected: ' + error)
}
)
mongoose.set('useFindAndModify', false);
// Setting up port with express js
const coursesRoute = require('./controllers/courses.route');
/** other routes I have removed to unclutter the code **/
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: false
}));
app.use(cors())
app.use('/api/course', coursesRoute);
app.get('/', (req, res) => {
res.send("Hello HTTPS!")
})
// port
const port = process.env.PORT || 3000;
http.createServer(app).listen( port, () => {
console.log('Listening on port ' + port);
});
**我需要知道的是,当我的文件夹结构如上时,如何从Node服务Angular。
回答如下:我认为您正在将源代码部署到heroku而不是构建版本。现在,您的angular
服务器在开发中时就在4200
上运行,但是一旦将其部署在Heroku
上即可。您将只能使用一个端口(由heroku分配)。
构建角度应用程序的命令为ng build
,但不要只是去运行此命令(了解它)。这将占用所有组件并在HTML files
之类的文件夹中构建几个文件,您可以依次部署。
阅读有关Deploying Angular App。 youtube上有各种教程,您可以在其中找到如何在云上部署MEAN Stack应用程序。