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

davidshen84 commented 5 years ago

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 commented 5 years ago

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

kangyizhang commented 5 years ago

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: https://github.com/angular/angular-cli/issues/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: https://github.com/angular/angular-cli/issues/8272#issuecomment-392777980)

dsmilkov commented 5 years ago

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 commented 5 years ago

@dsmilkov totally agree with you. Sent PR https://github.com/tensorflow/tfjs-data/pull/147

maxn0d3x commented 5 years ago

Why this error happens every time updated version???

nsthorat commented 5 years ago

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

Spectrevuln-sketch commented 1 year ago

i have same issues in my react app

nienkedekker commented 1 year ago

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;
    },
  };
};

tensorflow / tfjs