Import a code project
Turn every page of your Next.js, Vite, TanStack Start or Expo app into designs.
knighn import reads a project folder like a project tab does: it finds the framework and the routes, starts the project's own dev server, and captures each page. A dynamic route such as /blog/[slug] takes real pages from the links of the other pages.
cd my-app
knighn import .
It makes one design for each top-level group of routes: /pricing and /pricing/teams go in a design named Pricing. To change that:
| You want | Run |
|---|---|
| One design for the whole app | knighn import . --one |
| Only some groups | knighn import . --only pricing,blog |
| Names that start with your product | knighn import . --name "Acme" |
| Your own Home templates, not designs | knighn import . --as template |
.html files, not your account |
knighn import . --local designs |
Run it again
Each design remembers where it came from (a tag on the design and a line in the project's knighn.json), so the next knighn import . updates the same designs, even from another copy of the project. When an import stops part way, the next run goes on from the last design it saved; --restart starts again.
Edit the code instead
To change the app itself on a canvas, open it in a project tab: File > Open Project…, or knighn open.