我可以在Angular CLI应用程序中将自定义中间件添加到开发服务器吗？

Question

本质上，我想扩展Angular CLI的代理以启用我们组织用于支持唯一身份验证模型的一些自定义Express中间件。

Create React App supports this，方法是公开Express应用实例，然后让您app.use()拥有自己的中间件。

我找不到使用Angular CLI支持此功能的方法。不弹出就可以吗？

Answer 1

Angular（8+）自定义构建器支持此功能。

特别是，custom-webpack构建器使您可以使用Webpack的before钩子集成到自定义中间件中。

https://webpack.js.org/configuration/dev-server/#devserverbefore

例如，制作一个extra-webpack.config.js：

module.exports = {
  devServer: {
    before(app, server) {
      app.use(yourCustomMiddleware);
    }
  }
};

然后将其连接到angular.json：

"architect": {
  ...
  "build": {
    "builder": "@angular-builders/custom-webpack:browser"
    "options": {
      "customWebpackConfig": {
         path: "./extra-webpack.config.js"
      }