Module Not Found Can T Resolve

Source:

I am getting the following listing of errors when I run ng serve.

My package JSON is equally follows:

            {              "proper noun":              "ProName",              "version":              "0.0.0",              "scripts": {              "ng":              "ng",              "start":              "ng serve",              "build":              "ng build",              "examination":              "ng test",              "lint":              "ng lint",              "e2e":              "ng e2e"              },              "private":              true,              "dependencies": {              "@angular-devkit/build-angular":              "~0.12.0",              "@athwart/animations":              "5.2.10",              "@angular/common":              "five.2.10",              "@athwart/compiler":              "5.2.10",              "@angular/compiler-cli":              "5.2.x",              "@athwart/core":              "5.2.10",              "@angular/forms":              "5.2.x",              "@angular/platform-browser":              "5.two.ten",              "@angular/platform-browser-dynamic":              "5.2.x",              "@angular/router":              "5.2.ten",              "@types/dotenv":              "^four.0.3",              "@types/errorhandler":              "0.0.32",              "@types/limited":              "^4.sixteen.0",              "@types/node":              "^10.5.1",              "apostille-library":              "^7.ane.0",              "cadre-js":              "^two.5.4",              "dotenv":              "^6.0.0",              "errorhandler":              "^ane.5.0",              "express":              "^4.sixteen.0",              "nem2-sdk":              "^0.9.seven",              "rxjs":              "~six.3.3",              "stream":              "0.0.2",              "tslib":              "^1.9.0",              "typescript":              "^2.9.2",              "zone.js":              "~0.8.26"              } }                      

The error I get :

Fault in ./node_modules/aws-sign2/index.js Module non found: Error: Tin can't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/aws-sign2' Fault in ./node_modules/aws4/aws4.js Module not found: Error: Tin't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/aws4' ERROR in ./node_modules/ecc-jsbn/index.js Module not found: Mistake: Tin't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/ecc-jsbn' Error in ./node_modules/http-signature/lib/verify.js Module non found: Error: Can't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/http-signature/lib' ERROR in ./node_modules/http-signature/lib/signer.js Module not found: Mistake: Tin can't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/http-signature/lib' ERROR in ./node_modules/nem-sdk/build/external/nacl-fast.js Module not institute: Mistake: Can't resolve 'crypto' in '/Users/MYPC/Documents/Myproj/ProName/node_modules/nem-sdk/build/external' Fault in ./node_modules/nem-sdk/node_modules/aws-sign2/index.js

I ran into a similar issue lately while trying to employ another library (tiff.js) in a small project I was experimenting with.

The manner I got around this was to add the following to my package.json file, right after the devDependencies section.

                              "devDependencies": {     ... },                "browser": {                "crypto":                faux                }                          

This didn't seem to have any adverse effect when trying to utilize the library in the application.

Calculation this setting in tsconfig.json file under that projection resolve this warning

                              "compilerOptions": {                "baseUrl":                "./",                "paths": {                "crypto": [                "node_modules/crypto-js"                ] }                          

I like R. Richards's answer, merely I thought it would be useful to provide some more than information.

This is a known issue with Angular, and the Angular CLI dev team seems to think it'due south a feature rather than a bug. I, also equally other developers in this event thread, disagree. Contributors to that thread provided several workaround fixes, just my project didn't compile successfully until I implemented R. Richards' solution. I didn't revert the previous changes, though, so tacnoman's and GrandSchtroumpf'due south fixes may exist of use to others.

Some, like clovis1122 here and others in that outcome thread, have questioned why a web app would need access to these libraries and why the necessary tasks can't exist completed on the server side instead. I tin't speak for everyone, but my use example is that, when authenticating a user account, Strapi responds with a JSON Web Token cord that must be decoded past the client. Since the necessary library depends on crypto and stream, you won't exist able to extract the JWT expiration fourth dimension unless those dependencies are available.

In example anyone has problem extrapolating from R. Richards' reply, you'll have to set to faux whatever dependencies that are showing up in "tin can't resolve 10" errors. For case, the critical office of my package.json is:

                              "browser": {                "crypto":                false,                "stream":                faux                }                          

I idea I would expand on what Tarique Ahmed wrote in his answer.

I was using an npm module that had the following line in the code:

                              const                crypto =                require('crypto');                          

I couldn't add together:

                              "browser": {                "crypto":                false                }                          

to the package.json because the crypto packet had to exist part of the build.

It turns out that during the compilation process Angular seems to have decided to install the crypto-browserify package instead of crypto.

Adding the following to the tsconfig.json file instructs the build to use the crypto-browserify library every time that crypto is required. As you can see, I had the same upshot for the stream package.

                              "paths": {                "crypto": [                "node_modules/crypto-browserify"                ],                "stream": [                "node_modules/stream-browserify"                ] }                          

Afterwards having the same result with Athwart xi and crypto-js iv (and manually setting the path in tsconfig.json), I plant rolling dorsum crypto-js to version 3.i.ix-1 fixed the result. It seems a change fabricated in version four caused the issue.

              npm install crypto-js@3.1                .9-1                          

Explained here in repo issues:

GitHub event

If you upgraded to Webpack five, you need to add this to your webpack config file:

                              resolve: {                fallback: {                crypto:                imitation                }, },                          

aws-sign2 is a NodeJS parcel (and crypto is a NodeJS module), merely it looks like you're dealing with a web awarding. It makes sense that the crypto module is not available in that environment.

Would information technology be possible to complete what you lot demand to practise server-side? Otherwise, you may need to await for another package.

I have resolved my issue using beneath steps:

Add below to tsconfig.json to resolve crypto warning:

                              "paths": {                "crypto": [                "node_modules/crypto-js"                ]     },                          

and add below to angular.json

                              "options": {                "allowedCommonJsDependencies": [                "crypto-js"                ], ... }                          

For Laravel Inertia JS project, my solution was:

one- Add dependencies to bundle.json

                              "dependencies": {                "crypto-browserify":                "3.12.0",                "crypto-random-string":                "^3.3.0",                "stream":                "^0.0.ii"                }                          

2-In webpack.config.js:

                              const                path =                crave('path');                module.exports                = {                resolve: {                allonym: {                '@': path.resolve('resources/js'),         },                fallback: {                crypto:                require.resolve('crypto-browserify'),                stream:                require.resolve('stream'),         },     }, };                          

iii-Install, build and run:

              npm install && npm run watch                          

After a deep a research i plant that the solution is very simple: supervene upon import * as CryptoJS from 'crypto-js'; with declare var CryptoJS;

Using straight import may not work with ES6 Enviornment..

This may help y'all.

$ npm i crypto-js@latest // For using latest version iv

                              import                AES                from                'crypto-js/aes';                import                Utf8                from                'crypto-js/enc-utf8';                import                { secretKey }                from                './environments/environs';                /** Encryption */                const                data = {key:                'Test Value'};                const                ciphertext =                AES.encrypt(JSON.stringify(data), secretKey).toString();                console.log('Encrypted Data', ciphertext);                /** Decryption */                const                bytes =                AES.decrypt(ciphertext, secretKey);                const                decryptedData =                JSON.parse(bytes.toString(Utf8));                console.log('Decrypted Data', decryptedData);                          

https://github.com/brix/crypto-js/problems/168#issuecomment-785617218

Add together the option allowedCommonJsDependencies with literal "crypto-js" in a array, this in file angular.json:

                              "architect":                "build": {                "options": {                "allowedCommonJsDependencies": [                "crypto-js"                ]           },          }  }                          

This volition disable all warnings, tested in Angular 11.

My trouble was that I was trying to build to node and web using the aforementioned code, only is non possible to built to web while importing a WebSocket dependency, ws in my case

So the solution is past using a wrapper:

Install a wrapper, I will utilise isomorphic-ws considering is made for ws

              npm i --save isomorphic-ws                          

Remove const WebSocket = crave('ws')

Supplant with:

                              const                WebSocket                =                require('isomorphic-ws')                          

I had this problem in ReactJS with create-react-app(facebook)

Solution:

1. First install the necessary packages "crypto-browserify"

2. Modify webpack.config.js in reactjs with create-react-app this file is inside:

node_modules/react-scripts/config/webpack.config.js

• Search module.exports and inside this function there is a return:

                              module.exports                =                role                (webpackEnv) {   ...                return                {    ...                resolve: {       ...                fallback: {                // Here paste                crypto:                crave.resolve("crypto-browserify"),        }     }   } }                          

Note: Is possible yous need other packages how "stream-browserify" the steps are same. This solution works, only when the webpack project starts it shows warnings

Pd: I am not native speaker English, but I hope empathise me.

Copyright © 2022 QueryThreads

All content on Query Threads is licensed nether the Artistic Commons Attribution-ShareAlike 3.0 license (CC By-SA iii.0).

Source: https://www.querythreads.com/module-not-found-error-can-t-resolve-crypto/

Share this post