code-connect
code-connect copied to clipboard
Using backticks in the figmaNodeUrl of figma.connect results in an error
I am trying to connect icons at once using the client
from @figma/code-connect. However, when I use a template literal (${foo}
) expression in figmaNodeUrl
, it causes an error. How can I insert the node ID
into the URL using a template literal?
async function getIcons() {
const components = await client.getComponents(
"https://www.figma.com/...",
);
const icons = components.filter(({ name }) => name.startsWith("Icon"));
icons?.forEach((icon) => {
figma.connect(
icon,
`https://www.figma.com/abcd?node-id=${icon.id}`,
{
example: () => <Icon />,
},
);
});
}
I even discovered that in figma.connect, using "https://figma
" in figmaNodeUrl doesn't cause an error, but simply changing the double quotes to backticks, like `text
`, results in an error.
- double quotes in figmaNodeUrl (success)
figma.connect(
Arrow,
"https://www.figma.com/...",
{
example: () => <Arrow />,
},
);
- backticks in figmaNodeUrl (error)
figma.connect(
Arrow,
`https://www.figma.com/...`, // ## error ##
{
example: () => <Arrow />,
},
);