title: How to properly build an optimize Angular 5 Project?
body: <p>I'm new to Angular 5 project. I ran <code>ng build --prod</code> to generate a <code>dist/</code> folder.</p>
  
  <p>I noticed it takes quite a long time to build, and when I opened up my <code>dist/</code> folder, I saw it has almost 98% useless stuff in there, like SVGs, images, and so on ..</p>
  
  <p>How do I control what goes into my <code>dist/</code> ? </p>
  
  <hr>
  
  <p><strong>.angular-cli.json</strong></p>
  
  <pre><code>{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "project": {
      "name": "web"
    },
    "apps": [{
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "../node_modules/ngx-toastr/toastr.css",
        "../src/assets/css/style.css",
        "../src/assets/css/colors/blue.css"
  
      ],
      "scripts": [
        "../node_modules/jquery/dist/jquery.min.js",
        "../node_modules/popper.js/dist/umd/popper.min.js",
        "../node_modules/bootstrap/dist/js/bootstrap.min.js",
        "../node_modules/jquery-slimscroll/jquery.slimscroll.min.js",
        "../node_modules/pace-js/pace.min.js"
      ],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }],
    "e2e": {
      "protractor": {
        "config": "./protractor.conf.js"
      }
    },
    "lint": [{
        "project": "src/tsconfig.app.json",
        "exclude": "**/node_modules/**"
      },
      {
        "project": "src/tsconfig.spec.json",
        "exclude": "**/node_modules/**"
      },
      {
        "project": "e2e/tsconfig.e2e.json",
        "exclude": "**/node_modules/**"
      }
    ],
    "test": {
      "karma": {
        "config": "./karma.conf.js"
      }
    },
    "defaults": {
      "styleExt": "css",
      "component": {}
    }
  }
  </code></pre>
  
  <hr>
  
  <p><em>package.json</em></p>
  
  <pre><code>{
    "name": "web",
    "version": "0.0.0",
    "license": "MIT",
    "scripts": {
      "ng": "ng",
      "start": "ng serve --port 4202",
      "build": "ng build",
      "test": "ng test",
      "lint": "ng lint",
      "e2e": "ng e2e"
    },
    "private": true,
    "dependencies": {
      "@angular/animations": "5.1.0",
      "@angular/common": "5.0.3",
      "@angular/compiler": "5.0.3",
      "@angular/core": "5.0.3",
      "@angular/forms": "5.0.3",
      "@angular/http": "5.0.3",
      "@angular/platform-browser": "5.0.3",
      "@angular/platform-browser-dynamic": "5.0.3",
      "@angular/router": "5.0.3",
      "@ng-bootstrap/ng-bootstrap": "1.0.0-beta.5",
      "@ngx-translate/core": "8.0.0",
      "@types/jquery": "3.2.16",
      "angular2-image-upload": "^1.0.0-rc.0",
      "bootstrap": "4.0.0-beta.2",
      "core-js": "2.4.1",
      "jquery": "3.2.1",
      "jquery-slimscroll": "1.3.8",
      "ngx-toastr": "8.0.0",
      "ngx-uploader": "4.2.1",
      "pace-js": "1.0.2",
      "popper.js": "1.13.0",
      "rxjs": "5.5.0",
      "sticky-kit": "1.1.3",
      "zone.js": "0.8.4"
    },
    "devDependencies": {
      "@angular/cli": "^1.6.4",
      "@angular/compiler-cli": "5.0.3",
      "@angular/language-service": "5.0.3",
      "@types/jasmine": "~2.5.53",
      "@types/jasminewd2": "~2.0.2",
      "@types/node": "~6.0.60",
      "codelyzer": "~3.2.0",
      "jasmine-core": "~2.6.2",
      "jasmine-spec-reporter": "~4.1.0",
      "karma": "~1.7.0",
      "karma-chrome-launcher": "~2.1.1",
      "karma-cli": "~1.0.1",
      "karma-coverage-istanbul-reporter": "1.2.1",
      "karma-jasmine": "~1.1.0",
      "karma-jasmine-html-reporter": "0.2.2",
      "protractor": "~5.1.2",
      "ts-node": "~3.2.0",
      "tslint": "~5.7.0",
      "typescript": "~2.4.2"
    }
  }
  </code></pre>
  
  <hr>
  
  <p>How do I <strong>optimize</strong> it? And only build what require for my site?</p>
  
  <p>Currently, it takes <strong>15</strong> minutes to build on my server. How do I make it build faster? </p>