How to use fs module?

Photoshop UXP Plugin API
,
1

No matter how I try to get fs module working, for eveyry function I get:

… is not a function

In Dev Tools console it works just fine with:

const fs = require("fs")
fs.readdirSync("plugin:/")

But same code in the plugin does not - fs in the plugin is just empty object {}

Do I need something in the manifest? Docs don’t say anything :confused:

2

This is a plugin that reads text from sample.txt on the desktop and displays it in a Photoshop dialog.

It required permissions of “localFileSystem”: “fullAccess”.

// index.js

const { app } = require('photoshop') ;
const fs = require('fs') ;
const os = require('os') ;

const main = async () => {
  const filepath = path.join(os.homedir(), 'Desktop', 'sample.txt') ;
  const text = fs.readFileSync(filepath, {encoding: 'utf-8'}) ;
  app.showAlert(text) ;
} ;

// manifest.json

"requiredPermissions": {
  "localFileSystem": "fullAccess"
},
3

Oh, yes… I have "localFileSystem": "fullAccess" too. Still not a function :confused:

4

Tried readdirSync just to be sure, and it worked.

const { app } = require('photoshop') ;
const fs = require('fs') ;
const os = require('os') ;

const main = async () => {
  const contents = fs.readdirSync(path.join(os.homedir(), 'Desktop')) ;
  app.showAlert(contents.join('\n')) ;
} ;

Were you using manifest v4 until recently? requiredPermissions will be enabled in v5. And I remember that when we migrated from v4 to v5, we had to try many loads until it was applied, or something like that, anyway it finally came to fruition.

5

Nope, I’m on v5 for quite some time now :frowning:
As I mentioned, in console it works, but not if I run from plugin :confused: I’ll try to do more digging today. Sounds like I’m missing something on my side, but can’t figure out what it is

6

So it’s something with packaging the plugin. I found in my Webpack config I have this:

        resolve: {
            extensions: [".js", ".jsx", ".ts", ".tsx"],
            fallback: {
                "fs": false,
                "tls": false,
                "net": false,
                "zlib": false,
                "http": false,
                "https": false,
                "path": require.resolve("path-browserify"),
                "crypto": require.resolve("crypto-browserify"),
                "buffer": require.resolve("buffer/"),
                "stream": require.resolve("stream-browserify"),
            },
        },

If I remove "fs": false,, then I get

Error: Cannot find module ‘fs’

:confused:

7

Had to add this to Webpack config:

        externals: {
            fs: "commonjs2 fs",
        },

Good thing I already had:

        externals: {
            uxp: "commonjs2 uxp",
            photoshop: "commonjs2 photoshop",
            os: "commonjs2 os",
        },

If not this example, I would’ve pulled my hair out

2 Likes