Question

我是NodeJS和Express的新手，但我想要一个简单的'/'路由到Angular的默认index.html（client / src / index.html），其中包含app-root标签。

'/'路由成功地为index.html文件提供服务，但它不会将'app-root'标记扩展/加载到组件的html中，所以我只是得到空白页。

我不确定为什么在从Express发送路由时无法解析app-root标记。只有当我通过'ng serve'运行Angular时，index.html才会成功加载app-root标记的内容。

我的结构如下：

/client
    /e2e
    /node_modules
    /app
        app.component.css/html/ts
        app.module.ts
    /src
        index.html
        main.ts
package.json
server.js

server.js

var express = require('express');
var path = require('path');

var port = 80;

var app = express();

// set static folder
app.use(express.static(path.join(__dirname, '/client')));

app.get('/', function(req, res, next){
    res.sendFile(__dirname + '/client/src/index.html');
});

app.listen(port, function(){
    console.log("Server started on port " + port);
});

Answer 1

看起来你没有“建立”你的角度应用程序，因为main.ts仍在那里。

当您执行'ng serve'时，angular会编译并使用webpack-dev-server提供服务。

如果您希望从您的节点以静态方式提供应用程序，则需要一个已编译的角度应用程序。

您可以执行以下操作

$ cd client && ng build

在编译的角度应用程序所在的位置会创建client / dist目录，您可以在快递上提供

您可以更改server.js中的目录，如下所示

app.use(express.static(path.join(__dirname, '/client/dist')));
res.sendFile(__dirname + '/client/dist/index.html');

希望这有帮助

Angular 2'app-root'未在ExpressJS路由上加载

1 个答案: