Angular 17结合Nx本地运行时如何禁用SSR

方法1：临时单次禁用SSR #

启动开发服务器时直接追加参数跳过SSR编译：

nx serve 你的项目名称 --ssr false

这样启动的服务只会运行客户端代码，重载速度会大幅提升。

方法2：修改配置默认禁用SSR #

打开项目根目录的project.json，找到targets.serve节点的options部分，添加ssr: false配置：

{
  "targets": {
    "serve": {
      "executor": "@angular-devkit/build-angular:dev-server",
      "options": {
        "buildTarget": "你的项目名称:build",
        "ssr": false // 新增该行配置
      },
      // 其他原有配置...
    }
  }
}

之后直接运行nx serve 你的项目名称就默认以纯客户端模式启动。

方法3：手动添加独立的serve-ssr执行器 #

如果需要同时保留客户端和SSR两种启动方式，可以手动在project.json中新增serve-ssr目标：

{
  "targets": {
    "serve-ssr": {
      "executor": "@nx/angular:ssr-dev-server",
      "options": {
        "buildTarget": "你的项目名称:build",
        "serverTarget": "你的项目名称:server"
      },
      "configurations": {
        "production": {
          "buildTarget": "你的项目名称:build:production",
          "serverTarget": "你的项目名称:server:production"
        }
      }
    },
    // 其他原有配置...
  }
}

配置完成后，用nx serve-ssr 你的项目名称启动SSR模式，nx serve则启动纯客户端模式。

补充说明 #

Angular 17确实调整了SSR的默认集成逻辑，把SSR合并到了默认的serve命令中，而非单独拆分执行器，目的是简化配置流程，但也导致开发阶段重载变慢。上述三种方法可以根据你的实际需求灵活选择。

内容的提问来源于stack exchange，提问作者Chrillewoodz