Problem in production build when using CryptoJS

Question

Problem in production build when using CryptoJS

Navigation

#1 by (1 votes)

1

I have an application written in Angular 6 and there has been a need to send a hash to the client. The contractor only approved the use of crypto-js library. I did the implementation and everything works correctly in ng serve , but when doing the production build it gives an error.

Procedure completed:

Installation of crypto-ts dependency and typings.

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

Using CryptoJS

I make use of crypto-js in service of Angular. I leave below the two ways I tried to use the library to fix the error.

// Primeira maneira
import * as CryptoJS from 'crypto-js';
console.log(CryptoJS.MD5('minha-string').toString());

// Segunda maneira
import { MD5 } from 'crypto-js';
console.log(MD5('minha-string').toString());

The error returned is Module build failed . As below:

ERROR in ./node_modules/crypto-js/core.js
Module build failed (from ./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):

The problem only occurs when running the command ng build --prod

Has anyone ever gone through this? How could you solve the problem?

Thank you.

typescript angular build angular-6

asked by anonymous 04.10.2018 / 14:41

1 answer

How to use two date parameters for two Betweens without repeating the parameters using Spring Boots? Does VS Code have a Color Theme for each language?

score 1 · Accepted Answer

After suffering a little I solved my problem, I do not think it was the best way. So if someone else has another solution for this I'll be modifying the correct answer.

What I did to solve the problem:

First I went to the file angular.json and added the core.js and md5.js scripts in my scripts. As below:

"scripts": [
    "./node_modules/crypto-js/core.js",
    "./node_modules/crypto-js/md5.js"
]

Attention: There are 2 places with the key scripts, so modify in both places.

After this I modified my service in the angle as below:

import { Injectable } from "@angular/core";

declare var CryptoJS;
@Injectable()
export class HasherService {

     getMd5(str: string): string {
         return CryptoJS.MD5(str).toString();
     }

}