Create your own Slices & Components
By now you've probably got your project up and running and you've used Slice Machine components to create a page. Naturally now you'll want to create your own components and link them to Prismic.
Well, thanks to Slice Machine it's super easy!
⚠️NOTE: Sending your Slice models to Prismic
Previously your Slice models were pushed to Prismic when using --create-slice, this is now the last step when building components with the Slice builder.
Create a new Slice
You will need the 3.8.3-beta.0 version of the Prismic CLI, check by running:
You can go to that version by running the following command:
If you run into any problems try uninstalling and reinstalling the CLI.
Run the command and fill out the prompts:
prismic sm --create-slice
💡Haven't defined your framework?
If you didn't useto set up your project, you'll need to specify this to generate the correct files when you create a new slice with:
If you usedthen this is already done for you.
Here's an example of what running the command looks like. We select the @/slices local library (or create it if it doesn't exist), then we give it the name of NewSlice:
How the --create-slice command works
Once you run this command you will be shown the following prompts.
- Select your local lib: Select the library you're working with. By default, the
command adds a default path to your file, where means that the path is local.
- Enter the name of your slice: Name of your slice made by 2 PascalCased words.
When the command finishes you'll have a new Slice and it's Component ready to be used.
The component will have this structure in Nuxt.js:
The component will have this structure in Next.js:
Next let's learn how to preview that component locally and then build it out with our Visual Editor!
💡Deprecated: --pull command
Previously you could update your local Slices with Slice data from the Prismic repo using the experimental The Slice Builder Article.command. This has been deprecated and replaced by the process described in