Angular, завернутый в .Net Core 2.2.4, выводит index.html, работающий в Debug Docker Container

Question

У меня есть проект Angular V7, завернутый в .Net Core 2.2.4 с использованием новейшего шаблона, где вы можете запустить ng build, ng serve, и он отлично работает. Но когда я запускаю его в режиме отладки в контейнере Docker для Windows, index.html выводится в браузер, а символ «<» вызывает ошибку MIME, в которой я получаю. </p>

Я думал, что это была проблема со службами SPA или моей программой запуска, но это сообщение об ошибке говорит, что у меня проблема с модулем Angular. Я получал циклические ошибки с помощью ng build и думал, что исправлю их правильно, тестируя с помощью ng serve. Я только год изучаю Angular и .Net Core, и я действительно понятия не имею, где я ошибся.

Что я пробовал: Сборка моего startup.cs, program.cs, Dockerfile построчно. Изучая мои угловые файлы в деталях.

Вот что говорит Chrome:

Uncaught SyntaxError: Unexpected token <
core.js:15724 ERROR Error: Uncaught (in promise): Error: Loading chunk home-home-module failed.
(missing: https://localhost:44397/home-home-module.js)
Error: Loading chunk home-home-module failed.
(missing: https://localhost:44397/home-home-module.js)
    at HTMLScriptElement.onScriptComplete (bootstrap:133)
    at HTMLScriptElement.wrapFn (zone.js:1188)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:496)
    at invokeTask (zone.js:1540)
    at HTMLScriptElement.globalZoneAwareCallback (zone.js:1566)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1540)

ng вывод сервера sya, когда я собираю его в контейнере Docker для Windows - Linux - частично, чтобы оно было коротким:

chunk {default~admin-admin-module~error-error-module~home-home-module~portfolios-portfolios-module~reviews-~dd04c28b} default~admin-admin-module~error-error-module~home-home-module~portfolios-portfolios-module~reviews-~dd04c28b.js, default~admin-admin-module~error-error-module~home-home-module~portfolios-portfolios-module~reviews-~dd04c28b.js.map (default~admin-admin-module~error-error-module~home-home-module~portfolios-portfolios-module~reviews-~dd04c28b) 339 kB  [rendered]
[rendered]
chunk {error-error-module} error-error-module.js, error-error-module.js.map (error-error-module) 9.76 kB  [rendered]
chunk {home-home-module} home-home-module.js, home-home-module.js.map (home-home-module) 282 kB  [rendered]
chunk {main} main.js, main.js.map (main) 1.04 MB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 220 kB [initial] [rendered]
i ｢wdm｣: Compiled successfully.

Это то, что говорит выход, я подозреваю, что ответ лежит здесь в SPA и как он строит мой проект. Для меня все выглядит хорошо здесь.

    chunk {home-home-module} home-home-module.js, home-home-module.js.map (home-home-module) 282 kB  [rendered]

    >[40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
          Request starting HTTP/1.1 GET https://localhost:44397/runtime.js  
    Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request starting HTTP/1.1 GET https://localhost:44397/runtime.js  
    [40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.Server.Kestrel[34]
          Connection id "0HLM9Q6D5OLVD", Request id "0HLM9Q6D5OLVD:00000002": the application aborted the connection.
    Microsoft.AspNetCore.Server.Kestrel:Information: Connection id "0HLM9Q6D5OLVD", Request id "0HLM9Q6D5OLVD:00000002": the application aborted the connection.
    [40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware[2]
          Sending file. Request path: '/runtime.js'. Physical path: '/app/ClientApp/dist/runtime.js'
    Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware:Information: Sending file. Request path: '/runtime.js'. Physical path: '/app/ClientApp/dist/runtime.js'
    [40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
          Request finished in 42.1488ms 0 application/javascript
    Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request finished in 42.1488ms 0 application/javascript
    [40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
          Request starting HTTP/1.1 GET https://localhost:44397/home-home-module.js  
    Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request starting HTTP/1.1 GET https://localhost:44397/home-home-module.js  
    [40m[32minfo[39m[22m[49m: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
          Request finished in 36.5316ms 200 text/html; charset=UTF-8
    Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request finished in 36.5316ms 200 text/html; charset=UTF-8

Я в тупике.

Answer 1

Работай сегодня!

Я слишком много делал, пытаясь портировать Angular V7, завернутый в приложение .Net Core V2.2.4, которое использовало Webpack V4 и wwwroot, в Angular V7, завернутый в приложение .Net Core V2.2.4, которое использует Спа-услуги и папка dist.

Я должен был удалить Startup.cs и Program.cs и перестроить его снова по одному сервису и приложению за раз, а затем снова исправить правильные циклические ссылки. На этот раз я обратился к официальной угловой документации, чтобы понять это правильно. Так что теперь я могу ng build и ng serve, запустить его в отладочном режиме с помощью проекта, и он должен работать в Docker-контейнере.

Фактически отладка приложения с использованием настроек проекта позволила мне исправить все, например, авторизацию JWT, все мои сервисы и циклические ссылки. Эта версия углового шаблона довольно приятна; Мне это нравится! Я много узнал о файлах startup.cs и program.cs.

Итак, чтобы подвести итог, мое приложение было просто сломано, и его нужно было правильно очистить.