Menu
Use when adding syntax highlighting for custom languages to Prism.js, used by Docusaurus and many documentation sites
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Use when writing Vague (.vague) files that need realistic test data using faker generators for names, emails, addresses, dates, and more
Use when writing Vague (.vague) files - a declarative language for generating realistic test data with superposition, constraints, and cross-references
Use when working with JSON Schema for validation, including draft-07, 2019-09, and 2020-12 specifications
Use when configuring Spectral for API linting, creating custom rulesets, and validating OpenAPI or AsyncAPI specifications
Use when developing TypeScript npm packages including tsconfig, package.json exports, dual CJS/ESM builds, and publishing
Use when writing or modifying Vitest tests to follow best practices for test structure, assertions, mocking, and coverage
| name | prism-syntax |
| description | Use when adding syntax highlighting for custom languages to Prism.js, used by Docusaurus and many documentation sites |
Prism.languages.mylang = {
'comment': /\/\/.*/,
'string': /"(?:\\.|[^"\\])*"/,
'keyword': /\b(?:if|else|while|for|return)\b/,
'number': /\b\d+(?:\.\d+)?\b/,
'operator': /[+\-*/%=<>!&|]+/,
'punctuation': /[{}[\];(),.:]/
};
comment - Commentsstring - String literalskeyword - Language keywordsnumber - Numeric literalsoperator - Operatorspunctuation - Punctuation marksfunction - Function namesclass-name - Type/class namesproperty - Object propertiesboolean - true/falsebuiltin - Built-in functions{
// Lookbehind for context
'function': {
pattern: /(\bfunction\s+)\w+/,
lookbehind: true
},
// Nested grammar
'interpolation': {
pattern: /\$\{[^}]+\}/,
inside: {
'variable': /\$\{|\}/,
'expression': { pattern: /[\s\S]+/, inside: Prism.languages.javascript }
}
},
// Greedy matching
'string': { pattern: /"(?:\\.|[^"\\])*"/, greedy: true }
}
// docusaurus.config.js
module.exports = {
themeConfig: {
prism: {
additionalLanguages: ['mylang'],
theme: require('prism-react-renderer').themes.github,
}
}
};
// Create src/prism/prism-mylang.js and import in src/theme/prism-include-languages.js