2017-05-10 14 views
1

私はWebpackを使用しており、Angular 2からAngular 4にアップグレードしました。しかし、予想される60%のファイルサイズの縮小が私のコンパイルされたvendors.jsもapp.jsも見ていない。今913キロバイト :vendor.js 前角度2から角度4まで - ファイルサイズの縮小と速度の向上

975キロバイト

app.js 前:308キロバイト今 :307キロバイト

私は何をしないのですか?ファイルサイズの縮小を利用するには、Angular CLIを使用する必要がありますか?

私のpackage.json:

"dependencies": { 
    "@angular/common": "~4.0.1", 
    "@angular/compiler": "~4.0.1", 
    "@angular/core": "~4.0.1", 
    "@angular/forms": "~4.0.1", 
    "@angular/http": "~4.0.1", 
    "@angular/platform-browser": "~4.0.1", 
    "@angular/platform-browser-dynamic": "~4.0.1", 
    "@angular/router": "~4.0.1", 
    "core-js": "^2.4.1", 
    "rxjs": "5.0.1", 
    "zone.js": "^0.8.4" 
    }, 
    "devDependencies": { 
    "@types/node": "^6.0.45", 
    "angular2-template-loader": "^0.6.0", 
    "awesome-typescript-loader": "^3.0.4", 
    "copy-webpack-plugin": "^4.0.0", 
    "css-loader": "^0.25.0", 
    "css-to-string-loader": "^0.1.2", 
    "extract-text-webpack-plugin": "^1.0.1", 
    "file-loader": "^0.8.5", 
    "html-loader": "^0.4.3", 
    "html-webpack-plugin": "^2.15.0", 
    "ng2-facebook-sdk": "^1.1.0", 
    "null-loader": "^0.1.1", 
    "raw-loader": "^0.5.1", 
    "resolve-url": "^0.2.1", 
    "rimraf": "^2.5.2", 
    "style-loader": "^0.13.1", 
    "to-string-loader": "^1.1.5", 
    "typescript": "~2.1.6", 
    "webpack": "^1.13.0", 
    "webpack-dev-server": "^1.14.1", 
    "webpack-merge": "^0.14.0" 
    } 
} 
+3

あなたは違いを感じるためにIBMアカデミー、ES2015モジュールと最新のWebPACKを使用する必要があります(と、それは60%か何かになることを非常に低いです)。 *ベンダー*への言及は、あなたが何を期待しているかが明らかではないため、無意味です。ファイルサイズもそうです。縮小されたgzippedファイルを比較する必要があります。 – estus

+0

これらの会議の講演でのコメントにもっと耳を傾けてください。彼らはもっと積極的な木の揺れや小型化について話しており、cliバンドルウェブパックに反対して「閉鎖」と頻繁に言及しています。 ** **すべての**言及は、あなたがここで参照しているよりもはるかに大きなプロジェクトです。だから、それは主に「スケール」の問題であり、ある程度はさまざまなツールです。 –

答えて

0
Estusのコメントに基づいて

(とあなたに感謝)。 Angular 4サイズの縮小とスピードアップを利用するには、通常のJiT(Just in Time Compilation)ではなく、AoT(Ahead of Time Compilation)を使用する必要があります。 Angular CliでAoTを使用して、クライアントブラウザ用のAoTを作成します(プラットフォームブラウザ)。

は、それは、ユニバーサル(プラットフォーム・サーバーを使用してIBMアカデミーの別のフォーム)を使用して、検索エンジンのインデックス作成とSEOの利益のために、サーバ上で実行されている角度と混同しないようにしてAngular ahead-of-time compilation cookbook

を参照してください。

Angular Universal Doc

関連する問題