Importing across projects
In short: once you’ve imported a project A into a project B, then you can start using any component you created in A from within B. Beyond components, you can reuse any imported asset (images, icons, tokens, mixins, etc.).
You can also use imports as a way to copy/paste across projects.
Importing a project into another project
To import assets across projects:
- In your upstream project, make sure you have some components or other assets created.
- In the left sidebar, switch to the Published Versions tab, and publish a version of your project.
- Copy the project ID, which you can see in the URL bar. For a URL like https://studio.plasmic.app/projects/XjuFFTSZb8fanzCHT2C1jz, the project ID Is XjuFFTSZb8fanzCHT2C1jz.
- In your downstream project, in the left sidebar, switch to the Imported Projects tab to import the project you just published, pasting the upstream project’s ID.
- Now in your insert menu, you can see all the components and other assets available for insertion.
You can also repeatedly publish new versions of your upstream project and re-import the updates into your downstream project. This will update all imported assets directly in place.
Publishing versions also ensures you have a version history of your project. You can always revert back to an earlier version of the project.
Disconnecting imported projects
After you’ve imported a component across projects, you can later choose to disconnect from the imported project. To do so, go to the tab for Imported Projects in the left sidebar, and disconnect the dependency.
This won’t break anything in the downstream project; Plasmic will make a hard copy of any imported assets in use in the downstream project.
Copy/paste across projects
There isn’t yet built-in copy/paste, but you can use imports to work around this:
- Import the project that you want to copy from (as documented above).
- Insert the object you want.
- Disconnect the project (as documented above).
Additional notes about imports
You can import most assets, including components, images, icons, tokens, mixins, responsive breakpoints, global variants, and default styles.
However, you won’t see pages. Pages (unlike the aforementioned types) are not meant to be reusable parts of your design, but rather they are the top-level routes in an application. This is why even just a single project, you won’t see them as items in the insert menu. So when you are importing across projects, they similarly won’t show up anywhere there.
If you want a page to be something that’s reusable from elsewhere, you can convert it into a component. (You can also convert any component into a page.)
Imports vs. integrating multiple projects into code
When you are loading or syncing projects into your codebase (using the Headless API or codegen), you can specify multiple projects. This is independent of cross-project imports. You can load multiple projects that each have their own set of imported upstream dependencies.