External Javascript file for my plugin

Embed your JavaScript code in HTML.

and what about accessing external libraries? same problem

How did you include the external library?
<script src="https://hostname.com/library.js"></script>? There shouldn’t be any problems with this.

like that
<script src="ui.js"></script>

You have to embed js code in HTML:

<script>
    //your code
</script>

So i cannot put my UI code in seprate js file?

It don’t even want to load js files like that:
<script src="https://hostname.com/library.js"></script>

Sorry, but I can’t confirm this. For example, if I include the jQuery library, then I can access it in code.

<script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
<script>
    // Display the version number of the external library.
    console.log($.fn.jquery)
</script>

thank you 🙂

What is the difference between loading from CDN and local file? Why you can load via CDN but can’t the local js. What is the difference?

Figma doesn’t load your whole computer onto their servers when you publish a plugin, it only loads the files that are listed in the manifest: code.js and ui.html. It doesn’t care/know about any other files that exist in your file system and how they can be related to your code.

If you need to use external libraries, you either need to bundle them into one file (using Webpack, ESbuild etc.) or use a CDN.

What is the way to use external library in ut.html via Webpack? If Webpack will create bundle in dist/code.js I can’t use it as . How can I use some node_modules that I want to access in ui.html with using of Webpack?

@Gleb any ideas on what @Yaroslav20 is asking here? I have the same request. Thanks!

Indeed this (Webpack: see example) works great! Thanks!