如何在角度5应用程序中共享捆绑包?

时间:2018-01-02 16:22:05

标签: angular-cli

版本

Angular CLI: 1.6.0
Node: 7.9.0
OS: win32 x64
Angular: 5.1.2

... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.0.2
@angular/cli: 1.6.0
@angular/material: 5.0.2
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.0
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

Repro步骤

似乎无法在应用程序之间共享polyfill或样式表包。

angular cli json文件接受属性

"main": "main.ts",
"polyfills": "polyfills.ts",

但这意味着polyfills包是根据项目中的typescript文件构建的。

观察到的行为

在build命令输出中,index.html中通过脚本标记加载的包的文件名特定于构建:

Date: 2018-01-02T14:36:14.208Z
Hash: fd6ba1fc91245625191d
Time: 200577ms
chunk {0} main.73d822577495d0d76c3f.bundle.js, main.566ea3335f891f0ca934.bundle.css (main) 933 kB [initial] [rendered]
chunk {1} polyfills.e63bc529865281215d4c.bundle.js (polyfills) 389 kB [initial] [rendered]
chunk {2} styles.566ea3335f891f0ca934.bundle.css (styles) 18.2 kB [initial] [rendered]
chunk {3} inline.f3a6256283c314c7e1cc.bundle.js (inline) 1.45 kB [entry] [rendered]

期望的行为

“父”项目构建可以构建polyfill和/或css包,然后'child'项目可以引用它们吗?

不同的子项目将具有独立的构建生命周期并且是自包含的,共享的polyfills / css将在应用程序之间导航时改善页面加载时间。

提及可能有用的任何其他细节(可选)

我看了

http://www.velocitypartners.net/blog/2017/09/26/webpack-splitt-app-vendor-polyfill-builds/

但这似乎是特定角度4(??)并且需要搞乱package.json。

0 个答案:

没有答案