How Do I Distribute a Text File With My Plugin and Read From It?


this is my first Node.js/Typescript/Javascript project and everything is going fine, but I am not managing to add a file data.txt to my plugin and read from it in code.ts (data.txt contains some vector path data strings line by line).

The issue is (using npm run build -- --watch as my watch script) that I cannot import or require anything, as that’s either an Unexpected token import`` or a ReferenceError: 'require' is not defined.

Installing webpack and using webpack --watch as my watch script has solved this issue, but still, fs.readFileSync is TypeError: not a function.

Some more research has given me the impression that I am not to read from a local file using a client side javascript-script (I am sure I did not express this correctly), but how am I to bundle some data with my Figma plugin?

While this surely is a pure Javascript-Question, all my research has led to nowhere since I have difficulties transferring the context of the solutions I come across to the Figma plugin context, which is why I am asking in this forum.

Thank you very much for your help!

Thanks for a very detailed explanation of the issue you are having! Congrats: you are on a right path. Indeed, you need to bundle everything into a single file. Check out examples here using different bundling tools: Libraries and bundling | Plugin API (I personally prefer esbuild to webpack). Also I’m not sure if the config from these examples includes the ability to bundle txt files but if it doesn’t, google for something like “webpack import txt as string” or something along those lines.

Thank you very much for the swift reply, this was very helpful!

Best wishes!