Registry / web-framework / babel-plugin-prismjs

babel-plugin-prismjs

library2.1.0jsnpmunverified

A Babel plugin that transforms ES6 imports of PrismJS to include only specified languages, plugins, and themes, enabling tree-shaking and reduced bundle sizes for syntax highlighting. Version 2.1.0 is current, with stable release cadence. Requires Babel and PrismJS v1.18+. Key differentiator: automatically configures Prism for bundlers like Webpack without manual setup. Caveats: only works with ES6 import syntax, not CommonJS (require).

web-framework

npm install babel-plugin-prismjs

package ↗

INSTALL

IMPORT

SIG · BABEL-PLUGIN-PRISM

babel-plugin-prismjs

web-frameworkjavascriptv2.1.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ import Prism from 'prismjs'

✗ const Prism = require('prismjs')

Plugin only transforms ES6 import statements; CommonJS require is not supported.

Prism

✓ import { Prism } from 'prismjs'

✗ import Prism from 'prismjs'

Named export is incorrect; use default import to get the configured Prism instance.

Configures Babel to bundle only JavaScript, CSS, and markup languages with line-numbers plugin and twilight theme, then imports and applies Prism syntax highlighting.

// .babelrc { "plugins": [ ["prismjs", { "languages": ["javascript", "css", "markup"], "plugins": ["line-numbers"], "theme": "twilight", "css": true }] ] } // App.js import Prism from 'prismjs'; Prism.highlightAll();

Debug

Known issues

breakingOnly works with ES6 import syntax; require('prismjs') is not transformed.

fix

Use import Prism from 'prismjs' instead of require()

affects: all

gotchaIf languages array is empty, no languages are imported, but Prism may still highlight if other code loads languages.

fix

Explicitly list all languages needed in the languages array

affects: all

deprecatedThe 'css' option must be true for theme to apply CSS imports.

fix

Set "css": true in plugin options if using a theme

affects: all

Errors

Common errors & fixes

SyntaxError: Cannot use import statement outside a module

Using ES6 import without Babel configured to transform it, or running in a non-module environment.

fix

Ensure Babel is set up and the plugin is included; if running directly in Node, use .mjs extension or type: module in package.json

Prism.highlightAll is not a function

Prism imported via CommonJS require() which bypasses the plugin transformation, leaving Prism unconfigured.

fix

Replace const Prism = require('prismjs') with import Prism from 'prismjs'

Upgrade

Version history

2.1.0latest on npm

Audit

Dependencies

prismjsrequiredPeer dependency for PrismJS library

Agent activity

21 hits · last 30 days

node

OpenAI (training)

Resources

packagehttps://www.npmjs.com/package/babel-plugin-prismjs ↗