Error: Cannot find module 'fs'

bastien · November 19, 2021, 10:20am

Hello, I am creating a plugin for ps and without knowing why it fail miserably to build. It worked yesterday, I updated photoshop and adobx XD to last versions since)

an error during build in yarn watch

(/Users/bastien/miniconda3) myComputer:plugin bastien$ yarn watch
yarn run v1.22.10
$ nodemon -w src -e js,jsx,json,css,html -w webpack.config.js -x npm run build
[nodemon] 2.0.15
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): src/**/* webpack.config.js
[nodemon] watching extensions: js,jsx,json,css,html
[nodemon] starting `npm run build`

> com.adobe.uxp.starter.react@1.0.0 build
> webpack --mode development

Hash: e35d8c6b76fe076f4152
Version: webpack 4.46.0
Time: 7048ms
Built at: 19/11/2021 11:04:44
              Asset       Size  Chunks             Chunk Names
   icons/icon_D.png  568 bytes          [emitted]  
icons/icon_D@2x.png   1.01 KiB          [emitted]  
   icons/icon_N.png  535 bytes          [emitted]  
icons/icon_N@2x.png  995 bytes          [emitted]  
         index.html  186 bytes          [emitted]  
           index.js   8.52 MiB    main  [emitted]  main
            main.js  897 bytes          [emitted]  
      manifest.json   1.95 KiB          [emitted]  
Entrypoint main = index.js
[./node_modules/css-loader/dist/cjs.js!./src/styles.css] 563 bytes {main} [built]
[./node_modules/webpack-log/src/index.js] (webpack)-log/src/index.js 1.83 KiB {main} [built]
[./node_modules/webpack-log/src/loglevel/LogLevel.js] (webpack)-log/src/loglevel/LogLevel.js 2.01 KiB {main} [built]
[./node_modules/webpack-log/src/loglevel/MethodFactory.js] (webpack)-log/src/loglevel/MethodFactory.js 3.03 KiB {main} [built]
[./node_modules/webpack-log/src/loglevel/index.js] (webpack)-log/src/loglevel/index.js 1.4 KiB {main} [built]
[./src/actions/data.js] 3.85 KiB {main} [built]
[./src/controllers/CommandController.jsx] 1.68 KiB {main} [built]
[./src/controllers/PanelController.jsx] 1.41 KiB {main} [built]
[./src/index.jsx] 1.14 KiB {main} [built]
[./src/panels/Panel.jsx] 3.73 KiB {main} [built]
[./src/styles.css] 520 bytes {main} [built]
[./webpack.config.js] 1.06 KiB {main} [built]
[os] external "os" 42 bytes {main} [built]
[photoshop] external "photoshop" 42 bytes {main} [built]
[uxp] external "uxp" 42 bytes {main} [built]
    + 480 hidden modules

ERROR in ./node_modules/cacache/get.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/cacache'
 @ ./node_modules/cacache/get.js 6:11-24
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/chownr/chownr.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/chownr'
 @ ./node_modules/chownr/chownr.js 2:11-24
 @ ./node_modules/cacache/lib/util/fix-owner.js
 @ ./node_modules/cacache/lib/util/tmp.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/copy-concurrently/copy.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/copy-concurrently'
 @ ./node_modules/copy-concurrently/copy.js 8:13-26
 @ ./node_modules/move-concurrently/move.js
 @ ./node_modules/cacache/lib/util/move-file.js
 @ ./node_modules/cacache/lib/content/write.js
 @ ./node_modules/cacache/put.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/find-cache-dir/node_modules/make-dir/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/find-cache-dir/node_modules/make-dir'
 @ ./node_modules/find-cache-dir/node_modules/make-dir/index.js 2:11-24
 @ ./node_modules/find-cache-dir/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/fs.realpath/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/fs.realpath'
 @ ./node_modules/fs.realpath/index.js 8:9-22
 @ ./node_modules/glob/glob.js
 @ ./node_modules/rimraf/rimraf.js
 @ ./node_modules/del/index.js
 @ ./node_modules/clean-webpack-plugin/dist/clean-webpack-plugin.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/fs.realpath/old.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/fs.realpath'
 @ ./node_modules/fs.realpath/old.js 24:9-22
 @ ./node_modules/fs.realpath/index.js
 @ ./node_modules/glob/glob.js
 @ ./node_modules/rimraf/rimraf.js
 @ ./node_modules/del/index.js
 @ ./node_modules/clean-webpack-plugin/dist/clean-webpack-plugin.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/glob/common.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/glob'
 @ ./node_modules/glob/common.js 13:9-22
 @ ./node_modules/glob/glob.js
 @ ./node_modules/rimraf/rimraf.js
 @ ./node_modules/del/index.js
 @ ./node_modules/clean-webpack-plugin/dist/clean-webpack-plugin.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/globby/gitignore.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/globby'
 @ ./node_modules/globby/gitignore.js 2:11-24
 @ ./node_modules/globby/index.js
 @ ./node_modules/copy-webpack-plugin/dist/processPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/graceful-fs/graceful-fs.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/graceful-fs'
 @ ./node_modules/graceful-fs/graceful-fs.js 1:9-22
 @ ./node_modules/cacache/lib/verify.js
 @ ./node_modules/cacache/verify.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/infer-owner/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/infer-owner'
 @ ./node_modules/infer-owner/index.js 2:11-24
 @ ./node_modules/cacache/lib/util/fix-owner.js
 @ ./node_modules/cacache/lib/util/tmp.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/mkdirp/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/mkdirp'
 @ ./node_modules/mkdirp/index.js 2:9-22
 @ ./node_modules/cacache/lib/util/fix-owner.js
 @ ./node_modules/cacache/lib/util/tmp.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/move-concurrently/move.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/move-concurrently'
 @ ./node_modules/move-concurrently/move.js 4:13-26
 @ ./node_modules/cacache/lib/util/move-file.js
 @ ./node_modules/cacache/lib/content/write.js
 @ ./node_modules/cacache/put.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/path-exists/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/path-exists'
 @ ./node_modules/path-exists/index.js 2:11-24
 @ ./node_modules/locate-path/index.js
 @ ./node_modules/find-up/index.js
 @ ./node_modules/pkg-dir/index.js
 @ ./node_modules/find-cache-dir/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/path-type/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/path-type'
 @ ./node_modules/path-type/index.js 2:11-24
 @ ./node_modules/dir-glob/index.js
 @ ./node_modules/globby/index.js
 @ ./node_modules/copy-webpack-plugin/dist/processPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/rimraf/rimraf.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/rimraf'
 @ ./node_modules/rimraf/rimraf.js 6:9-22
 @ ./node_modules/del/index.js
 @ ./node_modules/clean-webpack-plugin/dist/clean-webpack-plugin.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/schema-utils/src/validateOptions.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/schema-utils/src'
 @ ./node_modules/schema-utils/src/validateOptions.js 8:11-24
 @ ./node_modules/schema-utils/src/index.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx

ERROR in ./node_modules/y18n/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/bastien/Documents/code/taf/myPlugin/plugin/node_modules/y18n'
 @ ./node_modules/y18n/index.js 1:9-22
 @ ./node_modules/cacache/lib/util/y.js
 @ ./node_modules/cacache/locales/en.js
 @ ./node_modules/cacache/index.js
 @ ./node_modules/copy-webpack-plugin/dist/postProcessPattern.js
 @ ./node_modules/copy-webpack-plugin/dist/index.js
 @ ./node_modules/copy-webpack-plugin/dist/cjs.js
 @ ./webpack.config.js
 @ ./src/actions/data.js
 @ ./src/panels/Panel.jsx
 @ ./src/index.jsx
npm ERR! code 2
npm ERR! path /Users/bastien/Documents/code/taf/myPlugin/plugin
npm ERR! command failed
npm ERR! command sh -c webpack --mode development

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/bastien/.npm/_logs/2021-11-19T10_04_44_572Z-debug.log
[nodemon] app crashed - waiting for file changes before starting...

npm log file :

0 verbose cli [
    0 verbose cli   '/Users/bastien/.nvm/versions/node/v15.0.1/bin/node',
    0 verbose cli   '/Users/bastien/.nvm/versions/node/v15.0.1/bin/npm',
    0 verbose cli   'run',
    0 verbose cli   'build'
    0 verbose cli ]
    1 info using npm@7.0.3
    2 info using node@v15.0.1
    3 timing config:load:defaults Completed in 12ms
    4 timing config:load:file:/Users/bastien/.nvm/versions/node/v15.0.1/lib/node_modules/npm/npmrc Completed in 0ms
    5 timing config:load:builtin Completed in 1ms
    6 timing config:load:cli Completed in 2ms
    7 timing config:load:env Completed in 1ms
    8 timing config:load:file:/Users/bastien/Documents/code/taf/myPlugin/plugin/.npmrc Completed in 0ms
    9 timing config:load:project Completed in 1ms
    10 timing config:load:file:/Users/bastien/.npmrc Completed in 0ms
    11 timing config:load:user Completed in 0ms
    12 timing config:load:file:/usr/local/etc/npmrc Completed in 0ms
    13 timing config:load:global Completed in 0ms
    14 timing config:load:cafile Completed in 1ms
    15 timing config:load:validate Completed in 2ms
    16 timing config:load:setUserAgent Completed in 0ms
    17 timing config:load:setEnvs Completed in 1ms
    18 timing config:load Completed in 21ms
    19 verbose npm-session cdbbc54da665c182
    20 timing npm:load Completed in 34ms
    21 timing command:run-script Completed in 8426ms
    22 verbose stack Error: command failed
    22 verbose stack     at ChildProcess.<anonymous> (/Users/bastien/.nvm/versions/node/v15.0.1/lib/node_modules/npm/node_modules/@npmcli/promise-spawn/index.js:63:27)
    22 verbose stack     at ChildProcess.emit (node:events:327:20)
    22 verbose stack     at maybeClose (node:internal/child_process:1048:16)
    22 verbose stack     at Process.ChildProcess._handle.onexit (node:internal/child_process:288:5)
    23 verbose pkgid com.adobe.uxp.starter.react@1.0.0
    24 verbose cwd /Users/bastien/Documents/code/taf/myPlugin/plugin
    25 verbose Darwin 21.1.0
    26 verbose argv "/Users/bastien/.nvm/versions/node/v15.0.1/bin/node" "/Users/bastien/.nvm/versions/node/v15.0.1/bin/npm" "run" "build"
    27 verbose node v15.0.1
    28 verbose npm  v7.0.3
    29 error code 2
    30 error path /Users/bastien/Documents/code/taf/myPlugin/plugin
    31 error command failed
    32 error command sh -c webpack --mode development
    33 verbose exit 2

log in the project in uxp dev tools :

index.js?6932:8 Uncaught Error: Cannot find module 'fs'
    at webpackMissingModule (VM87 index.js:8)
    at Object.eval (VM87 index.js:8)
    at eval (VM87 index.js:68)
    at Object../node_modules/fs.realpath/index.js (VM13 index.js:3144)
    at __webpack_require__ (VM13 index.js:20)
    at Object.eval (VM86 glob.js:43)
    at eval (VM86 glob.js:789)
    at Object../node_modules/glob/glob.js (VM13 index.js:3200)
    at __webpack_require__ (VM13 index.js:20)
    at eval (VM82 index.js:5)

What I am doing is a mix between this post and this other post (and it worked yesterday !) :

....

const uxp = require('uxp'); 
const app = require('photoshop').app;
const fs = require("uxp").storage.localFileSystem;

{
    //.....

    addAsLayer(document,photoUrl) {
        var xhrBinary = (url) =>{
            return new Promise((resolve, reject) => {
                const req = new XMLHttpRequest();
                req.onload = () => {
                    console.log("loading",data.globals.root+"/raw/"+url)
                    if (req.status === 200) {
                        try {
                            const arr = new Uint8Array(req.response);
                            resolve(arr);
                        } catch (err) {
                            reject('Couldnt parse response. ${err.message}, ${req.response}');
                        }
                    } else {
                        reject('Request had an error: ${req.status}');
                    }
                }
                req.onerror = reject;
                req.onabort = reject;
                console.log("loading",data.globals.root+"/raw/"+url)
                
                //req.open('GET', data.globals.root+"/raw/"+"corn_20210605_280_EXR00983_____corn_20210605_280_EXR00983.JPG", true); 
                
                req.open('GET', data.globals.root+"/raw/"+url, true);
                req.responseType = "arraybuffer";
                req.send();
            });
        }
        return new Promise((resolve,reject)=>{
            try {
                xhrBinary(photoUrl).then(photoObj=>{
                    fs.getTemporaryFolder().then(tempFolder=>{
                        tempFolder.createFile("tmp", { overwrite: true }).then(tempFile=>{
                            tempFile.write(photoObj, { format: uxp.storage.formats.binary }).then(ok=>{
                                app.open(tempFile).then(tempDoc=>{
                                    tempDoc.layers[0].duplicate(document).then(ok=>{
                                        tempDoc.closeWithoutSaving()
                                        resolve({ok});
                                    })              
                                })
                            });
                        })
                    });
                });
            } catch (err) {
                console.log(err.message);
                reject(err.message);
            }
        })
    }
    //....
}

bonus question : It is not the case actually but it used to warn me I was using the api V1 before the update maybe it is correlated. How can I be sure which API I am using (I have latest Photoshop and adobe XD)

thanks…

edit : my package.json is

{
  "name": "com.adobe.uxp.starter.react",
  "version": "1.0.0",
  "scripts": {
    "preinstall": "npx npm-force-resolutions",
    "watch": "nodemon -w src -e js,jsx,json,css,html -w webpack.config.js -x npm run build",
    "build": "webpack --mode development",
    "uxp:load": "cd dist && uxp plugin load",
    "uxp:reload": "cd dist && uxp plugin reload",
    "uxp:watch": "cd dist && nodemon --exec \"uxp plugin reload\" -e js,css,html",
    "uxp:debug": "cd dist && uxp plugin debug"
  },
  "author": "Adobe Inc",
  "license": "Apache-2.0",
  "devDependencies": {
    "@babel/core": "^7.8.7",
    "@babel/plugin-proposal-object-rest-spread": "^7.8.3",
    "@babel/plugin-syntax-class-properties": "^7.10.4",
    "@babel/plugin-transform-react-jsx": "^7.8.3",
    "babel-loader": "^8.0.6",
    "clean-webpack-plugin": "^2.0.2",
    "copy-webpack-plugin": "^5.0.3",
    "css-loader": "^2.1.1",
    "file-loader": "^5.1.0",
    "style-loader": "^1.1.3",
    "webpack": "^4.32.2",
    "webpack-cli": "^3.3.2"
  },
  "dependencies": {
    "cross-env": "^7.0.2",
    "immer": "^9.0.6",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "socket.io-client": "^4.3.2"
  },
  "resolutions": {
    "acorn": "npm:acorn-with-stage3"
  }
}

Karmalakas · November 19, 2021, 10:56am

According to the documentation, you’re missing the .uxp part

require('uxp').uxp.storage.localFileSystem

bastien · November 19, 2021, 11:05am

You are right, but if I do that I get Uncaught TypeError: Cannot read property 'storage' of undefined

my problem was dumb though… Thanks for your time

Karmalakas · November 19, 2021, 11:07am

I think this might be a mistype in the docs actually

If you have a solution, it would be great if you posted it as a separate answer explaining how you fixed the issue and mark it as a solution

bastien · November 19, 2021, 11:10am

ok I’ll do that right away

bastien · November 19, 2021, 11:11am

omg : vscode added me a dependency while transforming async → promises ie

import { resolve } from "../../webpack.config";

check your import …

Karmalakas · November 19, 2021, 11:21am

Definitely error in the docs. Found an issue already logged quite a while ago…

Topic		Replies	Views
Require('fs') is not working UXP Plugin API	6	1286	February 28, 2023
Error: Cannot find module 'uxp' Photoshop uxp , javascript	2	201	March 14, 2024
React.lazy() in plugins UXP Plugin API react	4	532	October 28, 2020
DevTools watch has never worked UXP Plugin API	9	416	August 9, 2022
Modules routinely not found.. Running on a Mac Adobe XD plugin , uxp	0	308	March 26, 2023

Error: Cannot find module 'fs'

Related topics