要将Angular作为Express的子应用,可以按照以下步骤进行操作:
angular-app
的文件夹,并在该文件夹中初始化一个Angular应用。ng new angular-app --routing --style=scss
express-app
的文件夹,并在该文件夹中初始化一个Express应用。mkdir express-app
cd express-app
npm init -y
express-app
文件夹中安装必要的Express和相关依赖。npm install express
express-app
文件夹中创建一个名为server.js
的文件,并将以下代码添加到文件中。const express = require('express');
const app = express();
// 静态资源目录为Angular应用的输出目录
app.use(express.static('../angular-app/dist/angular-app'));
// 所有路由都返回index.html,用于Angular路由
app.get('*', (req, res) => {
res.sendFile('index.html', { root: '../angular-app/dist/angular-app' });
});
// 启动Express服务器
app.listen(3000, () => {
console.log('Express server started on port 3000');
});
express-app
文件夹中启动Express服务器。node server.js
现在你可以在浏览器中访问http://localhost:3000
,就可以看到Angular应用作为Express的子应用运行了。
这个示例假设你的Angular应用已经打包为静态文件,并将其输出到了../angular-app/dist/angular-app
文件夹中。如果你的Angular应用位于不同的位置,你需要相应地修改express-app/server.js
文件中的静态资源目录和res.sendFile
的根目录。