在IIS子目录部署Angular11+.NET Core5项目出现语法错误求助

错误原因分析 #

浏览器提示的Unexpected token '<'说明请求的runtime.js、polyfills.js等静态文件实际返回的是HTML内容（即SPA的index.html），这是因为服务器没有正确匹配到静态资源路径，转而触发了SPA的路由回退机制，返回了首页文件。

修复步骤 #

1. 调整ASP.NET Core Startup配置 #

修改Startup.cs中的SPA配置，添加路由前缀并指定静态文件请求路径：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // ... 其他代码保持不变

    app.UseSpa(spa =>
    {
        spa.Options.SourcePath = "ClientApp";
        // 设置SPA路由前缀为目标子目录
        spa.Options.RoutePrefix = "/caui";
        // 指定静态文件的请求路径
        spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
        {
            RequestPath = "/caui"
        };

        if (env.IsDevelopment())
        {
            spa.UseAngularCliServer(npmScript: "start");
        }
    });
}

同时确认AddSpaStaticFiles的RootPath指向正确的Angular构建产物目录：

services.AddSpaStaticFiles(configuration =>
{
    // 确保发布后该目录存在Angular的build文件
    configuration.RootPath = "ClientApp/dist";
});

2. 验证Angular构建配置 #

你的angular.json和package.json已正确设置baseHref和deployUrl，需确保构建后的dist/index.html中，静态资源引用路径为/caui/开头（例如<script src="/caui/runtime.js"></script>）。重新执行构建命令确保配置生效：

npm run build

3. IIS配置检查 #

• 网站应用池需设置为无托管代码（符合.NET Core项目运行要求）。
• 确认服务器已安装ASP.NET Core托管模块（ANCM），这是.NET Core应用在IIS运行的必要组件。
• 网站物理路径指向发布后的.NET Core项目根目录，无需在IIS中单独创建caui子应用（路由前缀由.NET Core自身处理）。

4. 发布配置验证 #

检查发布配置（.pubxml），确保发布过程中包含ClientApp/dist目录下的所有文件，或配置了自动执行npm run build的步骤，保证Angular构建产物被正确发布到服务器。

内容的提问来源于stack exchange，提问作者V. Periyasamy