tfjs: Module not found: Error: Can't resolve 'crypto' in 'C:

To get help from the community, check out our Google group.

TensorFlow.js version

@tensorflow/tfjs”: “^0.12.0”,

Browser version

Version 67.0.3396.99 (Official Build) (64-bit)

Describe the problem or feature request

I am using angular 6 with tensorflow.js in the latest versions of tensorflow I get a warning in the console that somme crypto module is not found I have this warning all the time, what should I do/?

Code to reproduce the bug / link to feature request

import * as tf from ‘@tensorflow/tfjs’;

import { Component, OnInit } from '@angular/core';
import * as tf from '@tensorflow/tfjs';



@Component({
  selector: 'app-xor-example',
  templateUrl: './xor-example.component.html',
  styleUrls: ['./xor-example.component.css']
})
export class XorExampleComponent implements OnInit {

  // TRAINING DATA.
  x_train = tf.tensor2d([[0, 0], [0, 1], [1, 0], [1, 1]]);
  y_train = tf.tensor2d([[0], [1], [1], [0]]);

  // Defining a model.
  model: tf.Sequential;

  constructor() { }

  ngOnInit() {

  }

  async initModel() {

    this.model = tf.sequential();
    this.model.add(tf.layers.dense({ units: 8, inputShape: [2], activation: 'tanh' })); // input layer
    this.model.add(tf.layers.dense({ units: 1, activation: 'sigmoid' })); // output layer
    const optimizer = tf.train.sgd(0.01);
    this.model.compile({
      optimizer: optimizer,
      loss: 'binaryCrossentropy',
    });


    // Creating dataset
    const xs = tf.tensor2d([[0, 0], [0, 1], [1, 0], [1, 1]]);
    xs.print();
    const ys = tf.tensor2d([[0], [1], [1], [0]]);
    ys.print();
    // Train the model
    await this.model.fit(xs, ys, {
      batchSize: 1,
      epochs: 1500
    });

    const saveResults = await this.model.save('localstorage://my-model-1');

    const loadedModel = await tf.loadModel('localstorage://my-model-1');
    console.log('Prediction from loaded model:');
    // loadedModel.predict(tf.ones([1, 3])).print();

    this.prediction = this.model.predict(xs);
    console.log(this.prediction);

  }

}

this is from chrome console

Uncaught ReferenceError: global is not defined
    at Object../node_modules/protobufjs/src/util/minimal.js (minimal.js:49)
    at __webpack_require__ (bootstrap:76)
    at Object../node_modules/protobufjs/src/writer.js (writer.js:4)
    at __webpack_require__ (bootstrap:76)
    at Object../node_modules/protobufjs/src/index-minimal.js (index-minimal.js:13)
    at __webpack_require__ (bootstrap:76)
    at Object../node_modules/protobufjs/minimal.js (minimal.js:4)
    at __webpack_require__ (bootstrap:76)
    at Object../node_modules/@tensorflow/tfjs-converter/dist-es6/data/compiled_api.js (compiled_api.js:1)
    at __webpack_require__ (bootstrap:76)

and this is what I see in the console xor test

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 3
  • Comments: 25 (4 by maintainers)

Commits related to this issue

Most upvoted comments

Hi @George35mk -

I found a couple of cycles to try this out. It looks like this is a problem with the core-parts of the angular webpack bundler. I followed the steps here: https://gist.github.com/niespodd/1fa82da6f8c901d1c33d2fcbb762947d

But instead of using a pre-install, I just hand edited `node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js’ and changed the lines in that regex:

// old:
node: false,
// new:
node: { crypto: true, stream: true },

I found an issue that you should chime-in on to help fix this down the road: https://github.com/angular/angular-cli/issues/10954

Hope this helps!

Because I needed to work with some 3D tensors I installed again the tensorflow.js package in my angular application, and again I get the same error:

Can’t resolve ‘crypto’ in 'C:\Users\user.…

what I found to solve this warnings without modifing any of the angular core files but only your package.json

try this on your package.json

{
  "scripts": { },
  "dependencies": { },
  "devDependencies": { },

  "browser": {
    "crypto": false
  }

}

Because I needed to work with some 3D tensors I installed again the tensorflow.js package in my angular application, and again I get the same error:

Can’t resolve ‘crypto’ in 'C:\Users\user…

what I found to solve this warnings without modifing any of the angular core files but only your package.json

try this on your package.json

{
  "scripts": { },
  "dependencies": { },
  "devDependencies": { },

  "browser": {
    "crypto": false
  }

}

Worked for me! Thank you!

Hi @George35mk -

I found a couple of cycles to try this out. It looks like this is a problem with the core-parts of the angular webpack bundler. I followed the steps here: https://gist.github.com/niespodd/1fa82da6f8c901d1c33d2fcbb762947d

But instead of using a pre-install, I just hand edited `node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js’ and changed the lines in that regex:

// old:
node: false,
// new:
node: { crypto: true, stream: true },

I found an issue that you should chime-in on to help fix this down the road: angular/angular-cli#10954

Hope this helps!

I love you

same issue 2021

While the original issue was an error, it is now manifested as a warning on my system.

WARNING in ./node_modules/@tensorflow/tfjs-core/dist/tf-core.esm.js
Module not found: Error: Can't resolve 'crypto' in 'C:\Users\user\github\repo.github.io\source\node_modules\@tensorflow\tfjs-core\dist'

My Angular app works as expected in the browser.

Environment

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 6.2.5
Node: 8.11.1
OS: win32 x64
Angular: 6.1.10
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router, service-worker

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.8.5
@angular-devkit/build-angular     0.8.5
@angular-devkit/build-optimizer   0.8.5
@angular-devkit/build-webpack     0.8.5
@angular-devkit/core              0.8.5
@angular-devkit/schematics        0.8.5
@angular/cdk                      6.4.7
@angular/cli                      6.2.5
@angular/material                 6.4.7
@angular/pwa                      0.7.5
@ngtools/webpack                  6.2.5
@schematics/angular               0.8.5
@schematics/update                0.8.5
rxjs                              6.3.3
typescript                        2.7.2
webpack                           4.20.2

Hi @George35mk - I found a couple of cycles to try this out. It looks like this is a problem with the core-parts of the angular webpack bundler. I followed the steps here: https://gist.github.com/niespodd/1fa82da6f8c901d1c33d2fcbb762947d But instead of using a pre-install, I just hand edited `node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js’ and changed the lines in that regex:

// old:
node: false,
// new:
node: { crypto: true, stream: true },

I found an issue that you should chime-in on to help fix this down the road: angular/angular-cli#10954 Hope this helps!

I cannot find the file.

In angular 11, the path of the file changed. So the new file looks like this:

const fs = require('fs')
const f = 'node_modules/@angular-devkit/build-angular/src/webpack/configs/browser.js'

fs.readFile(f, 'utf8', function(err, data) {
  if (err) {
    return console.log(err)
  }
  var result = data.replace(/node: false/g, 'node: {crypto: true, stream: true, fs: "empty"}')

  fs.writeFile(f, result, 'utf8', function(err) {
    if (err) return console.log(err)
  })
})

Hi @George35mk -

I found a couple of cycles to try this out. It looks like this is a problem with the core-parts of the angular webpack bundler. I followed the steps here: https://gist.github.com/niespodd/1fa82da6f8c901d1c33d2fcbb762947d

But instead of using a pre-install, I just hand edited `node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js’ and changed the lines in that regex:

// old:
node: false,
// new:
node: { crypto: true, stream: true },

I found an issue that you should chime-in on to help fix this down the road: angular/angular-cli#10954

Hope this helps!

thank you. It helped me!!!

I’m using React, and downgrading “react-scripts” version in package.json from “5.0.0” to “4.0.3” did the trick for me.