设置 MEAN 堆栈而不渲染 app-root
Setting up MEAN stack not rendering app-root
我正在尝试按照此 guide 设置基本平均堆栈,但客户端似乎没有呈现应用程序,而是正文包含,
<body>
<app-root></app-root>
</body>
文件结构与 空白 angular cli 项目完全相同 除了 添加了两个额外的文件。
加上:npm install --save ejs cors express body-parser
routes/index.js
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('index.html');
});
module.exports = router;
server.js
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var cors = require('cors')
var index = require('./routes/index');
// app
var app = express();
// cors
app.use(cors());
// views
app.set('views', path.join(__dirname, 'src'));
// engine
app.set('view enginer', 'ejs');
app.engine('html', require('ejs').renderFile);
// angular dist
app.use(express.static(__dirname + '/dist'));
// body bodyParser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
// route
app.use('/', index);
// Initialize the app.
var server = app.listen(process.env.PORT || 3000, function () {
var port = server.address().port;
console.log("App now running on port", port);
});
我 运行 一个 ng build
和 node server.js
但在浏览器中得到一个空白页面。
也许有一个我不知道的重大变化,因为该指南使用的是 angular2(我使用的是 angular6)。
由于您的 index.html
不直接位于 dist
文件夹中(而是出于某种原因位于子文件夹中),请尝试将 app.use(express.static(__dirname + '/dist'));
更改为 app.use(express.static(__dirname + '/dist/<your project name here>'));
我正在尝试按照此 guide 设置基本平均堆栈,但客户端似乎没有呈现应用程序,而是正文包含,
<body>
<app-root></app-root>
</body>
文件结构与 空白 angular cli 项目完全相同 除了 添加了两个额外的文件。
加上:npm install --save ejs cors express body-parser
routes/index.js
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('index.html');
});
module.exports = router;
server.js
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var cors = require('cors')
var index = require('./routes/index');
// app
var app = express();
// cors
app.use(cors());
// views
app.set('views', path.join(__dirname, 'src'));
// engine
app.set('view enginer', 'ejs');
app.engine('html', require('ejs').renderFile);
// angular dist
app.use(express.static(__dirname + '/dist'));
// body bodyParser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
// route
app.use('/', index);
// Initialize the app.
var server = app.listen(process.env.PORT || 3000, function () {
var port = server.address().port;
console.log("App now running on port", port);
});
我 运行 一个 ng build
和 node server.js
但在浏览器中得到一个空白页面。
也许有一个我不知道的重大变化,因为该指南使用的是 angular2(我使用的是 angular6)。
由于您的 index.html
不直接位于 dist
文件夹中(而是出于某种原因位于子文件夹中),请尝试将 app.use(express.static(__dirname + '/dist'));
更改为 app.use(express.static(__dirname + '/dist/<your project name here>'));