1. first implement your headless compoenents 2. implement your componeents / ui components / pages, add them under `src/componenets/gift-card` and `src/componenets/ui/gift-card`. use your headless compoenents to implement your components 3. headless / ui
npm install @wix/vibe-gift-voucher-plugin-files1. first implement your headless compoenents
2. implement your componeents / ui components / pages, add them under src/componenets/gift-card and src/componenets/ui/gift-card. use your headless compoenents to implement your components
3. headless / ui (shadcn) guidelines: https://github.com/wix-incubator/headless-components/blob/main/docs/api/API.md
Notes:
Make sure your headless sdk packages (i.e. @wix/stores) are part of picasso main template package.json here: https://github.com/wix-private/picasso/blob/master/packages/picasso-template-image/main/package.json, otherwise PR or ask the picasso team to add them. Make sure it is a version that includes your headless components.
node scripts/build-zip.js - it should only compress compoentns/ and components/ui/ folders.zipPathvibe-gift-card-plugin and use the zip file from there to be used during the "install" step and copy the files over to the picasso template in runtime1. npm run reset-template (re-run this to reset it)
brings and resets the main Wix Wibe template for you to test your components over
1. npm run bootstrap
This will initialize your dev site for your module:
- Create a site
- Create a headless component
- Create a dev center component and install on the site
- Create a wix.config.json (which you can commit and push, preferably add other team member as collaboratoes so they can access it too)
- Create a .env.local file connected to your new site and app (this should not be pushed to Git)
- In CI CD flow use fire console in order to generate an API key you can use in order to perform login with npx wix login --api-key command
- The site will serve as the site you use in order to view the business information you see when running locally
1. npm run template-dev
Start the dev server allowing you to start coding, the repo is equipped with a set of cursor rules allowing you to develop the headless component easier, you can adjust them to your liking
1. npm run template-check && npm run template-build - to make sure there all your components play nicely over the Wix Vibe template