How to use CryptoJs in angular 4

Good morning, I'm trying to implement CryptoJs in angle 4 but when I run the app it gives me the following error:

import { Component } from '@angular/core';

import * as CryptoJS from 'crypto-js';


@Component({
    selector: 'home',
    templateUrl: 'app/vistas/home.html'
})
export class HomeComponent{
    public titulo: string;
    public hash: string;



    constructor(){
        this.titulo = 'Webapp de productos con Angular 4';
        this.hash = "valor antes de hashear";
    }

    ngOnInit(){
        console.log('Se ha cargado el componente home.component.ts');
        console.log("Antes de hashear: " + this.hash);

        console.log("Valor despues de hash: " + this.ecnript(this.hash));

        console.log("Despues de hashear: " + this.hash);
    }

    ecnript(valor:any){
        const sha256 = CryptoJS.SHA256(valor);
        return sha256;
    }
}

And this is the error that I get by console:

(index):26 Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/crypto-js
    Error: XHR error (404 Not Found) loading http://localhost:3000/crypto-js
        at XMLHttpRequest.wrapFn (http://localhost:3000/node_modules/zone.js/dist/zone.js:1166:39)
        at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:425:31)
        at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:192:47)
        at ZoneTask.invokeTask [as invoke] (http://localhost:3000/node_modules/zone.js/dist/zone.js:499:34)
        at invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:1540:14)
        at XMLHttpRequest.globalZoneAwareCallback (http://localhost:3000/node_modules/zone.js/dist/zone.js:1566:17)
    Error loading http://localhost:3000/crypto-js as "crypto-js" from http://localhost:3000/app/components/home.component.js
        at XMLHttpRequest.wrapFn (http://localhost:3000/node_modules/zone.js/dist/zone.js:1166:39)
        at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:425:31)
        at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:192:47)
        at ZoneTask.invokeTask [as invoke] (http://localhost:3000/node_modules/zone.js/dist/zone.js:499:34)
        at invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:1540:14)
        at XMLHttpRequest.globalZoneAwareCallback (http://localhost:3000/node_modules/zone.js/dist/zone.js:1566:17)
    Error loading http://localhost:3000/crypto-js as "crypto-js" from http://localhost:3000/app/components/home.component.js

Thank you very much.

Here is the package.json file.

{
  "name": "angular-quickstart",
  "version": "1.0.0",
  "description": "QuickStart package.json from the documentation, supplemented with testing support",
  "scripts": {
    "build": "tsc -p src/",
    "build:watch": "tsc -p src/ -w",
    "build:e2e": "tsc -p e2e/",
    "serve": "lite-server -c=bs-config.json",
    "serve:e2e": "lite-server -c=bs-config.e2e.json",
    "prestart": "npm run build",
    "start": "concurrently \"npm run build:watch\" \"npm run serve\"",
    "pree2e": "npm run build:e2e",
    "e2e": "concurrently \"npm run serve:e2e\" \"npm run protractor\" --kill-others --success first",
    "preprotractor": "webdriver-manager update",
    "protractor": "protractor protractor.config.js",
    "pretest": "npm run build",
    "test": "concurrently \"npm run build:watch\" \"karma start karma.conf.js\"",
    "pretest:once": "npm run build",
    "test:once": "karma start karma.conf.js --single-run",
    "lint": "tslint ./src/**/*.ts -t verbose"
  },
  "keywords": [],
  "author": "",
  "license": "MIT",
  "dependencies": {
    "@angular/common": "~4.3.4",
    "@angular/compiler": "~4.3.4",
    "@angular/core": "~4.3.4",
    "@angular/forms": "~4.3.4",
    "@angular/http": "~4.3.4",
    "@angular/platform-browser": "~4.3.4",
    "@angular/platform-browser-dynamic": "~4.3.4",
    "@angular/router": "~4.3.4",
    "angular-in-memory-web-api": "~0.3.0",
    "core-js": "^2.4.1",
    "crypto": "^1.0.1",
    "crypto-js": "^3.1.9-1",
    "rxjs": "5.0.1",
    "sha256": "^0.2.0",
    "systemjs": "0.19.40",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@types/crypto-js": "^3.1.37",
    "@types/jasmine": "2.5.36",
    "@types/node": "^6.0.90",
    "canonical-path": "0.0.2",
    "concurrently": "^3.2.0",
    "jasmine-core": "~2.4.1",
    "karma": "^1.3.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "lite-server": "^2.2.2",
    "lodash": "^4.16.4",
    "protractor": "~4.0.14",
    "rimraf": "^2.5.4",
    "tslint": "^3.15.1",
    "typescript": "~2.1.0"
  },
  "repository": {},
  "jspm": {
    "dependencies": {},
    "devDependencies": {}
  }
}

If I attach the capture that the folder is included.

make the indicated change now I am having this error.