我正在为我的 J2EE 应用程序 (Spring MVC) 使用 Angular2。我已经实现了延迟加载,但最初加载仍然需要更多时间(大约 2 分钟!!!)。
有两个大文件正在加载:
typescript.js:4.75 MB
编译器.umd.js:0.98 MB
并且 typescript.js 文件没有缓存。每次重新加载它的下载。
我的 systemjs.config.js 文件是:
System
.config({
transpiler : 'ts',
typescriptOptions : {
"target" : "es5",
"module" : "commonjs",
"moduleResolution" : "node",
"sourceMap" : true,
"emitDecoratorMetadata" : true,
"experimentalDecorators" : true,
"lib" : [ "es2015", "dom" ],
"noImplicitAny" : true,
"suppressImplicitAnyIndexErrors" : true
},
meta : {
'typescript' : {
"exports" : "ts"
}
},
paths : {
'npm:' : 'uploads/node_modules/'
},
map : {
'app' : 'app',
'@angular/animations' : 'npm:@angular/animations/bundles/animations.umd.js',
'@angular/animations/browser' : 'npm:@angular/animations/bundles/animations-browser.umd.js',
'@angular/core' : 'npm:@angular/core/bundles/core.umd.js',
'@angular/common' : 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler' : 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser' : 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser/animations' : 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
'@angular/platform-browser-dynamic' : 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http' : 'npm:@angular/http/bundles/http.umd.js',
'@angular/router' : 'npm:@angular/router/bundles/router.umd.js',
'@angular/router/upgrade' : 'npm:@angular/router/bundles/router-upgrade.umd.js',
'@angular/forms' : 'npm:@angular/forms/bundles/forms.umd.js',
'@angular/upgrade' : 'npm:@angular/upgrade/bundles/upgrade.umd.js',
'@angular/upgrade/static' : 'npm:@angular/upgrade/bundles/upgrade-static.umd.js',
// other libraries using node_modules
'rxjs' : 'npm:rxjs',
'angular-in-memory-web-api' : 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
'ts' : 'npm:plugin-typescript/lib/plugin.js',
'typescript' : 'npm:typescript/lib/typescript.js',
'angular2-datatable' : 'npm:angular2-datatable',
'lodash' : 'npm:lodash/lodash.js',
'angular2-datatable-pagination' : 'npm:angular2-datatable-pagination',
'jquery' : 'lib/jquery/jquery-3.2.0.min.js',
'ngx-pagination' : 'lib/ngxpagination/ngx-pagination.js',
},
packages : {
app : {
defaultExtension : 'ts'
},
rxjs : {
defaultExtension : 'js'
},
'angular2-datatable' : {
main : 'index.js',
defaultExtension : 'js'
}
},
"scripts" : [ "lib/jquery/jquery-3.2.0.min.js" ]
});
有什么办法可以减少这两个文件(typescript.js,compiler.umd.js)的大小吗?
它是一个电子商务应用程序。所以我应该解决这个问题。请分享此问题的任何解决方案。
谢谢
最佳答案
我强烈建议您将 Angular 2 项目更新为 Angular 4 项目。 Angular 4 的特性之一是它的体积缩小了 60%。 Angular 2 和 4 是兼容的,有一些东西会破坏,比如 typeScript 和 rxjs,它们也需要更新。这需要大约 2 或 3 个小时才能完成。
您也可以使用 Ahead Of Time Compiler 进行编译这也会稍微提高速度。
Here is an article to update to angular 4 如文章所述,您可以运行命令:
( window )
npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest --save
(Linux)
npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest typescript@latest --save
祝一切顺利!
关于javascript - Angular2 应用程序初始加载问题。 typescript.js 文件是 4.75MB,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46421019/