Module not found: Error: Can't resolve 'fs'

[davidshen84]

TensorFlow.js version

@tensorflow/tfjs@0.15.1

Browser version

Chrome Version 72.0.3626.109 (Official Build) (64-bit)

Describe the problem or feature request

My Angular app was using tfjs@0.13.4. When I try to upgrade to 0.15.1, I got this error when executing the ng build command. But I am not even using the tfjs-data component.

After I revert tfjs to 0.13.4, my code compiles and the app worked again.

Code to reproduce the bug / link to feature request

All the dependencies in my app.

      "dependencies": {
	"@angular/animations": "^7.2.6",
	"@angular/cdk": "^7.3.3",
	"@angular/common": "^7.2.6",
	"@angular/compiler": "^7.2.6",
	"@angular/core": "^7.2.6",
	"@angular/forms": "^7.2.6",
	"@angular/http": "^7.2.6",
	"@angular/material": "^7.3.3",
	"@angular/platform-browser": "^7.2.6",
	"@angular/platform-browser-dynamic": "^7.2.6",
	"@angular/pwa": "^0.13.3",
	"@angular/router": "^7.2.6",
	"@angular/service-worker": "^7.2.6",
	"@davidshen84/ngx-webcam": "^0.2.2",
	"@tensorflow/tfjs": "^0.15.1",
	"@types/hammerjs": "^2.0.36",
	"angularx-qrcode": "^1.5.3",
	"core-js": "^2.6.5",
	"hammerjs": "^2.0.8",
	"ngx-clipboard": "^11.1.9",
	"ngx-markdown": "^7.1.3",
	"ngx-mathjax": "0.0.4",
	"ngx-store": "^2.1.0",
	"normalize.css": "^8.0.1",
	"prismjs": "^1.15.0",
	"rxjs": "^6.4.0",
	"zone.js": "^0.8.29"
      },
      "devDependencies": {
	"@angular-devkit/build-angular": "^0.13.3",
	"@angular/cli": "^7.3.3",
	"@angular/compiler-cli": "^7.2.6",
	"@angular/language-service": "^7.2.6",
	"@types/del": "^3.0.1",
	"@types/gulp": "^4.0.5",
	"@types/gulp-shell": "0.0.31",
	"@types/jasmine": "^3.3.9",
	"@types/jasminewd2": "^2.0.6",
	"@types/mathjax": "0.0.35",
	"@types/node": "^11.9.4",
	"ajv": "^6.9.1",
	"codelyzer": "~4.5.0",
	"del": "^3.0.0",
	"gulp": "^4.0.0",
	"gulp-shell": "^0.6.5",
	"jasmine-core": "~3.3.0",
	"jasmine-spec-reporter": "~4.2.1",
	"karma": "^4.0.0",
	"karma-chrome-launcher": "~2.2.0",
	"karma-coverage-istanbul-reporter": "^2.0.5",
	"karma-jasmine": "^2.0.1",
	"karma-jasmine-html-reporter": "^1.4.0",
	"protractor": "^5.4.2",
	"rxjs-spy": "^7.5.0",
	"ts-node": "~8.0.2",
	"tslint": "~5.12.1",
	"typescript": "^3.2.4"
      }

[djimoh5]

Experiencing the exact same issue....reverting back to 0.14.1 works for me

[kangyizhang]

hi @davidshen84 and @djimoh5

@tensorflow/tfjs-data is part of the @tensorflow/tfjs union package. The error is because of angular-cli does not support modules in node like "fs" and "path". Original issue: angular/angular-cli#10681

I tested locally and the "fs" can be resolve by adding "browser": { "fs": false, "path": false, "os": false} in your package.json (original solution: angular/angular-cli#8272 (comment))

[dsmilkov]

Instead of asking our users to specify the browser field in their package.json, we should update our tfjs-data/package.json to have 'node-fetch':false, 'string_decoder':false and 'fs':false under package.browser.

I found those 3 packages when I searched for 'require()' usages in tfjs-data repo.

@kangyizhang can you do that? Thanks!

[kangyizhang]

@dsmilkov totally agree with you. Sent PR tensorflow/tfjs-data#147

[maxn0d3x]

Why this error happens every time updated version???

[nsthorat]

@NiNJAD3vel0per are you still seeing this error? Could you make sure you remove node_modules and re-install?

[Spectrevuln-sketch]

i have same issues in my react app

[nienkedekker]

I'm using speech-commands (great work!) in a NextJS application. When loading the model like this in a component:

import * as speechCommands from '@tensorflow-models/speech-commands';

I get the same error: can't resolve 'fs'. @kangyizhang's fix worked, but I'd rather not directly edit node_modules. Adding the following to my next.config.js solved the issue for me:

config.resolve.fallback = { fs: false };

To illustrate:

module.exports = (phase, { defaultConfig }) => {
  const config = {
    webpack: (config, { isServer }) => {
      // plugin config, etc
      config.resolve.fallback = { fs: false };
      return config;
    },
  };
};