Debug Angular 8 .net core spa，直接从src / assets / css中显示的css文件，而不是dist / assets / css中的css文件，并且未编译scss

Question

。Net Core 3.1（从2.2升级），Angular 8（从7升级）在VS 2019（以前在VS 2017）上运行的SPA。

我的主题.css文件是从node_modules / @ angular / material / prebuilt-themes获得的，或者是从它们的.scss文件构建的，如angular.json中所指定，摘录：

  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        "outputPath": "dist",
        "index": "src/index.html",
        "main": "src/main.ts",
        "polyfills": "src/polyfills.ts",
        "tsConfig": "src/tsconfig.app.json",
        "assets": [
            "src/favicon.ico",
            "src/assets"
        ],
        "styles": [
            /* Everything that will get compiled into the styles.css bundle */
            "src/assets/css/styles.css",
            /* Angular material pre-built themes - bring over from node_modules/@angular/material/prebuilt-themes */
            {
                "input": "node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
                "bundleName": "assets/css/angular-material-themes/deeppurple-amber",
                "inject": false /* i.e. don't add to head of index.html automatically */
            },
            ...
            /* Our Angular material themes - build from their .scss files in src/styles/angular-material-themes  */
            {
                "input": "src/styles/angular-material-themes/indigo-slateblue.scss",
                "bundleName": "assets/css/angular-material-themes/indigo-slateblue",
                "inject": false
            },
            ...
        ],

Angular SPA在VS中调试应用程序时自动运行，摘录自Startup.cs：

    public void ConfigureServices(IServiceCollection services) {

        services.AddControllers();
        services.AddHttpContextAccessor();
        services.AddSpaStaticFiles(configuration => {
            configuration.RootPath = "ClientApp/dist";
        });
        ...

    public void Configure(IApplicationBuilder app, IWebHostEnvironment env, IHttpContextAccessor httpContextAccessor, IMapper autoMapper) {
        ...
        app.UseSpa(spa => {
            spa.Options.SourcePath = "ClientApp";
            if (env.IsDevelopment()) {
                spa.UseAngularCliServer(npmScript: "start");

            }
        });

我的主题css文件由服务提供，类似于Medium article（本质上是获取主题名称，然后通过在其中添加新的来加载它。]

在我的Chrome控制台中获得以下内容：

Refused to apply style from 'https://localhost:44396/assets/css/angular-material-themes/indigo-pink.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

这是找不到.css文件并加载index.html的结果（通过尝试直接将其加载到另一个选项卡中进行了测试）。当它运行时，dist / assets / css / angular-material-themes中的文件未更新，并且我发现所提供的文件直接来自src / assets / css。由于有角度的材质主题文件来自其他地方，因此根本不会加载。我可以手动将旧版本的.css文件C＆P压缩为src / assets / css，重新启动应用程序，然后加载正常。此外，在升级到Angular 8之前，这一切都运转良好。

在使用Angular 8的VS2019中的调试过程中能使它正常工作的任何帮助？

Answer 1

根据Juri的文章Dynamically Load CSS with the Angular CLI，标题为“提示：开发中的延迟加载”的部分。

因此，这显然已经可以正常工作了，现在正在编译标准角形材质主题.css文件和我自己的.scss主题文件。我仍然不知道css输出文件放在哪里，所以如果有人知道，请分享！