Import crypto-js in an angular 2 project (created with angular-cli)

Question

I'm trying to import crypto-js in my angular2 project.

I followed several SO questions and also angular-cli guide, but at the end I still have the error Cannot find module 'crypto-js'

What I tried :

npm install crypto-js --save

and

typings install dt~crypto-js --global --save

then I modified the file angular-cli-build.js

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'systemjs/dist/system-polyfills.js',
      'systemjs/dist/system.src.js',
      'zone.js/dist/**/*.+(js|js.map)',
      'es6-shim/es6-shim.js',
      'reflect-metadata/**/*.+(ts|js|js.map)',
      'rxjs/**/*.+(js|js.map)',
      '@angular/**/*.+(js|js.map)',
      'crypto-js/**/*.+(js|js.map)'
    ]
  });
};

and the file src/system-config.ts

const map: any = {
    'crypto-js': 'vendor/crypto-js'
};

/** User packages configuration. */
const packages: any = {
    'crypto-js': {
        format: 'cjs'
    }
};

After using

import * as CryptoJS from 'crypto-js';

I still have my error. Did I miss something ?

Thanks

stackblitz.com/edit/encrypt-decrypt-app check this example

Nikhil K S
– Nikhil K S

2019-02-26 09:00:48 +00:00
Commented Feb 26, 2019 at 9:00 — Nikhil K S
– Nikhil K S, Commented Feb 26, 2019 at 9:00

WesDev · Accepted Answer · 2022-08-28 13:50:09Z

31

This may help you:

$ npm install crypto-js --save
$ npm install @types/crypto-js --save-dev

then:

import * as CryptoJS from 'crypto-js';

or

import CryptoJS = require('crypto-js');

edited Aug 28, 2022 at 13:50

answered Nov 17, 2016 at 11:23

WesDev

5845 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

zjx · Accepted Answer · 2017-11-16 07:46:03Z

4

You can try following as a solution:

1. npm install --save @types/crypto-js


2. import { AES } from "crypto-js";


3. AES.encrypt('my message', 'secret key');

edited Nov 16, 2017 at 7:46

answered Nov 16, 2017 at 6:42

zjx

665 bronze badges

1 Comment

Catscarlet Over a year ago

I use SHA3 and I find out that: import { SHA3 } from "crypto-js"; makes the dist.js a little fat than import * as SHA3 from 'crypto-js/sha3';. It's about 100KB. I don't know why.

Greg · Accepted Answer · 2016-12-23 20:48:44Z

0

Ok I got it. I just download the DefinitelyTyped file in typings/crypto-js/ and then I add the line /// <reference path="../../typings/crypto-js/crypto-js.d.ts" /> before importing CryptoJS.

edited Dec 23, 2016 at 20:48

answered Jul 20, 2016 at 12:50

Greg

1,0442 gold badges14 silver badges28 bronze badges

1 Comment

antonio Over a year ago

That link doesnt work... I used link and added that files in: node_modules/crypto-js then on my class I imported: import * as CryptoJS from '../../../node_modules/crypto-js'

Vibhor Dube · Accepted Answer · 2020-06-16 12:16:44Z

0

Add this to your Package.JSON file.

"browser": {
    "crypto": false
}

Doing so will tell your application when you run ng serve to not to bundle your Crypto library to serve to the browser.

answered Jun 16, 2020 at 12:16

Vibhor Dube

5,2211 gold badge27 silver badges35 bronze badges

Comments

António Ribeiro · Accepted Answer · 2020-07-24 14:39:43Z

0

Add the script path in angular-cli.json file after installing cryto-js & @types/crypto-js

"scripts": [
    "../node_modules/crypto-js/crypto-js.js"
]

edited Jul 24, 2020 at 14:39

António Ribeiro

4,2305 gold badges35 silver badges51 bronze badges

answered Jul 24, 2020 at 12:28

Tameezuddin Mohammad

11 bronze badge

Collectives™ on Stack Overflow

Import crypto-js in an angular 2 project (created with angular-cli)

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related