0

我正在运行 angular2-cli 应用程序并尝试在浏览器上运行构建文件以进行查看，当文件更改时，这些构建文件应该自动检测更改并更新更改并像观察者一样自动在浏览器上查看？

如何做到这一点？

我使用了以下命令：-

ng build --prod --build-optimizer --watch

创建构建文件后，如何使用这些构建文件显示视图并在应用程序中的文件发生更改时自动检测更改并且相应的视图应该更新？

我正在使用部署 dist 文件

 npm install http-server -g

http-server ./dist.

但是，angular-app 中的任何更改都不会更新。

文件更改和保存时出错：-

<--- Last few GCs --->

    [4880:000002362A3E0200]  3073977 ms: Mark-sweep 1313.4 (1441.8) -> 1313.4 (1441.8) MB, 1912.2 / 0.1 ms  last resort GC in old space requested


    <--- JS stacktrace --->

    ==== JS stack trace =========================================

    Security context: 0000029E02FA54D9 <JSObject>
        2: /* anonymous */ [0000002EF25822D1 <undefined>:~5461] [pc=000001803821AEBC](this=0000033F46320061 <JSFunction base54 (sfi = 000003E0C2B4A539)>,str=0000009E2323E039 <Very long string[2687906]>,delta=1)
        3: /* anonymous */ [0000002EF25822D1 <undefined>:5430] [bytecode=000002BED7ECCD79 offset=83](this=0000026E50826AC9 <AST_Toplevel map =
    000002DAD9648199>,options=0000008766ACE9C9 <Object...

    FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
     1: node::DecodeWrite
     2: node_module_register
     3: v8::internal::FatalProcessOutOfMemory
     4: v8::internal::FatalProcessOutOfMemory
     5: v8::internal::Factory::NewRawTwoByteString
     6: v8::internal::Smi::SmiPrint
     7: v8::internal::StackGuard::HandleInterrupts
     8: v8::internal::AsmJsScanner::IsNumberStart
     9: 

000001803

56043C1
4

2 回答 2

0

基本上该错误与堆内存有关..

增加内存可以解决这个问题..

无论如何，我也在 angular.json 中发布了构建命令和配置，以供详细参考。

仅供参考：我在 Angular 6 中验证了这个过程。

"prod-build-ui-now": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng build --deploy-url /_assets/angular/project_name/ --output-path dist/project_name/ --prod --project project_name --watch"

这里--watch是主要的角色。

--max_old_space_size=2048将处理堆内存不足的问题。如果您仍然遇到问题，只需将值 1024 增加到该值。

--prod将在您的 angular.json 中获取 prod 配置。

"production": { "optimization": false, "outputHashing": "all", "sourceMap": true, "extractCss": true, "namedChunks": false, "aot": false, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": false, "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ] }

上述配置将确保您快速获得最新更新。

于 2019-11-07T07:54:10.687 回答
0

ng 构建后您无法观看文件。如果您想在测试应用程序时继续编辑，只需使用 ng serve -o

于 2018-06-21T12:49:56.227 回答