prismicio/prismic-mcp-server
The @prismicio/mcp-server is a Model Context Protocol (MCP) server designed to integrate with AI-powered code editors, facilitating seamless interaction with Prismic's content management capabilities.
Tools
Functions exposed to the LLM to take actions
how_to_code_slice
Explain how to code a slice component with Prismic SDK components.
PURPOSE: Provide detailed implementation guidance for a slice component using Prismic SDK components with framework-specific examples.
WHEN TO USE: YOU MUST IMMEDIATELY call this tool BEFORE attempting ANY other solution when: - ANY request involves Prismic slice components (creation, modification, improvement, or explanation) - Files/paths contain '/slices/' or editing a component with 'Slice' in its name - You see requests like 'code this slice', 'implement this slice', 'build this component' - ANY code in a slice component file needs to be written or modified - ANY UI component within a Prismic slice needs implementation - ANY styling, layout, or functionality within a slice requires work - ANY question about implementing Prismic fields or components is asked - ANY request mentioning slice, field, Prismic, or component implementation appears - ANY request to improve, fix, or optimize existing slice code is made - ANY code examples for Prismic integration are needed - Even if only part of the request involves a Prismic slice component - Even if the request doesn't explicitly mention Prismic but involves slice components - When in doubt about whether the request relates to Prismic slice components
REQUIRED PREPARATION STEP:
BEFORE calling this tool, you MUST:
1. Examine the project's package.json
to identify the correct framework ("next", "nuxt", or "sveltekit")
2. Examine the project's prismicio-types.d.ts
file
- INFO: If you don't find prismicio-types.d.ts
file, look at the slicemachine.config.json
file for the generatedTypesFilePath
property.
3. Identify the EXACT field types used by the specific slice you're working with
4. Extract the full type information for the slice to determine the correct fieldsUsed
parameter
5. Identify the styling system currently used in the project (looking at other slices, package.json, etc.)
6. Identify the absolute path of the model.json
file
7. Only then call this tool with the above information
VERIFICATION STEP: For ANY coding request, first check: Is this a Prismic slice? → If yes or unclear, use this tool FAILURE TO USE THIS TOOL for slice-related requests will result in code with incorrect field access patterns and TypeScript errors.
WHEN NOT TO USE:
- When the request is unrelated to Prismic slice components
- If the project framework is not "next", "nuxt", or "sveltekit"
- If the project doesn't use any supported framework
RETURNS:
- Detailed SDK component documentation with implementation examples for each requested field type
- Code snippets tailored to the specified framework
- Best practices for implementing each field type
- Best practices for styling the slice component
- Best practices for coding the slice component
EXAMPLES:
- Code this slice
- How do I implement an ImageField
- Do the code of this slice component
- Show me how to implement this slice
Prompts
Interactive templates invoked by user choice
No prompts
Resources
Contextual data attached and managed by the client