Importing a team library component using plugin

Hello!

I’m trying to create a plugin for me and my team that allows 1) Creates a bunch of pages that we use all the time 2) import our cover component on the first page so people can change it to whatever suits the project.

Creating the pages was pretty easy :ballot_box_with_check:

When trying to import the component I referred to the documentation and found importComponentByKeyAsync but I’m not quite sure how to use it properly. I was able to locate the component key so that part I have. I did try and look at a couple of other topics to see if I could see how others were doing it but all the others are trying to manipulate the component after they get it in while I’m just trying to do a straight import.

Sorry for being a complete n00b but any help would be appreciated

1 Like

Ah thanks for the quick reply!

So this is exactly what I had but for some reason its not importing the component. I’ve check that its a published library so I should be all good there. and I know it works because I was able to use the automator plugin to test the key was working.

When I try figma.importComponentSetByKeyAsync(key) I get a 404 but figma.importComponentByKeyAsync(key) shows no errors at all. not quite sure were I’m going wrong

I’m not sure what could be wrong on your end, but try creating a new file and importing the component into it.

If I just delete everything else and leave just what you posted, when running nothing happens on the page or in the logs. It all seems like it should create the instance and drop it on the default Page 1 but nothing :cry:

If the node didn’t appear on the canvas and the layers panel, then the plugin is probably closing before the promise resolves.

Try creating a new promise, wait for it to resolve, create an instance, and call the plugin close.

Ahh nice! that worked. thank you very much @tank666

For anyone else that might need it in the future:

async function importNode() {
let importComponent = await figma.importComponentByKeyAsync(key);
importComponent.createInstance()
figma.closePlugin();
}

importNode()

Hi @tank666 @Kenny_Lopez i need one help how we are getting this key ? Can i access any components whom i don’t have access but by this key i can import the components . Really sorry i am very noob at Figma.

Steps would really help.

Thanks :blush: