Prism Blade

Blade Language syntax highlighting for Prism.

• GitHub
• NPM

---

Installation

npm i prism-blade

Alternative: CDN

<!-- Get Prism from the CDN -->
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/prism.min.js"></script>

<!-- Make sure to include Prism and the following language definitions -->
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-php.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-javascript.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-css.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-markup-templating.min.js"></script>

<!-- Then include the script from the CDN -->
<script src="https://cdn.jsdelivr.net/npm/prism-blade@latest/dist/prism-blade.min.js"></script>

---

Usage

import Prism from 'prismjs';
import 'prism-blade';

const code = `@include('header')`;
const html = Prism.highlight(code, Prism.languages.blade, 'blade');

---

Preview

Interpolation

Interpolations in attribute values

Unscaped interpolation

Comments

Directives

Components

Scripts and style blocks

@php directive

@verbatim directive