All Projects → mAAdhaTTah → Babel Plugin Prismjs

mAAdhaTTah / Babel Plugin Prismjs

A babel plugin to use PrismJS with standard bundlers.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Babel Plugin Prismjs

Ts Monorepo
Template for setting up a TypeScript monorepo
Stars: ✭ 459 (+302.63%)
Mutual labels:  webpack, rollup, babel
Xdm
a modern MDX compiler. No runtime. With esbuild, Rollup, and webpack plugins
Stars: ✭ 206 (+80.7%)
Mutual labels:  webpack, rollup, babel
Template.js
A javascript template engine, simple, easy & extras, support webpack, rollup, parcel, browserify, fis and gulp
Stars: ✭ 1,201 (+953.51%)
Mutual labels:  webpack, rollup, browserify
Modular Css
A streamlined reinterpretation of CSS Modules via CLI, API, Browserify, Rollup, Webpack, or PostCSS
Stars: ✭ 234 (+105.26%)
Mutual labels:  webpack, rollup, browserify
Serverless Plugin Typescript
Serverless plugin for zero-config Typescript support
Stars: ✭ 611 (+435.96%)
Mutual labels:  webpack, rollup, babel
Astexplorer.app
https://astexplorer.net with ES Modules support and Hot Reloading
Stars: ✭ 65 (-42.98%)
Mutual labels:  webpack, babel, babel-plugin
Compiled
A familiar and performant compile time CSS-in-JS library for React.
Stars: ✭ 1,235 (+983.33%)
Mutual labels:  webpack, babel, babel-plugin
Nodefony Starter
Nodefony Starter Node.js Framework
Stars: ✭ 95 (-16.67%)
Mutual labels:  webpack, babel
React From Scratch
Building a Modern React App from Scratch in 2021
Stars: ✭ 87 (-23.68%)
Mutual labels:  webpack, babel
Frontie Webpack
Front-end Boilerplate | Gulp 4 + Webpack 4 + Babel + ITCSS Architecture + BEM Methodology + Twig.js
Stars: ✭ 102 (-10.53%)
Mutual labels:  webpack, babel
Js Proposal Algebraic Effects
📐Let there be algebraic effects in JS
Stars: ✭ 110 (-3.51%)
Mutual labels:  babel, babel-plugin
Shortstack
🥞 minimal Rollup + PostCSS modern syntax starter template
Stars: ✭ 94 (-17.54%)
Mutual labels:  rollup, babel
Babel Plugin Jsx Adopt
Stars: ✭ 94 (-17.54%)
Mutual labels:  babel, babel-plugin
Wordless
All the power of Pug, Sass, Coffeescript and WebPack in your WordPress theme. Stop writing themes like it's 1998.
Stars: ✭ 1,374 (+1105.26%)
Mutual labels:  webpack, babel
Webpack Core Usage
webpack2完整系列课程,欢迎阅读。同时欢迎移步我的react全家桶文章全集: https://github.com/liangklfangl/react-article-bucket
Stars: ✭ 94 (-17.54%)
Mutual labels:  webpack, babel
React Bootstrap Webpack Starter
ReactJS 16.4 + new React Context API +react Router 4 + webpack 4 + babel 7+ hot Reload + Bootstrap 4 + styled-components
Stars: ✭ 103 (-9.65%)
Mutual labels:  webpack, babel
Npm Pipeline Rails
Use npm as part of your Rails asset pipeline
Stars: ✭ 93 (-18.42%)
Mutual labels:  webpack, browserify
Koa Mobx React Starter
A straightforward starter for Node javascript web projects. Using Koa, MobX and ReactJS (with universal / isomorphic server rendering)
Stars: ✭ 102 (-10.53%)
Mutual labels:  webpack, babel
Angular Es6
Angular ES6 utility library. Write directives, controllers and services as ES6 classes.
Stars: ✭ 103 (-9.65%)
Mutual labels:  webpack, babel
Lecture Frontend Dev Env
"[인프런] 프론트엔드 개발환경의 이해와 실습" 강의 실습 자료입니다.
Stars: ✭ 108 (-5.26%)
Mutual labels:  webpack, babel

babel-plugin-prismjs Build Status

A babel plugin to use PrismJS with standard bundlers.

How to Use

This plugin allows you to treat PrismJS as a standard module and configure what languages, plugins, & themes you want to bundle with Prism.

In your code, import prismjs:

import Prism from 'prismjs';

Prism.highlightAll();

The exported Prism object will be the fully-configured Prism instance.

Limitations

  • You must be using ES6 imports to load PrismJS.

Configuring the plugin

In your .babelrc, register the plugin and configure its dependencies:

{
  "plugins": [
    ["prismjs", {
        "languages": ["javascript", "css", "markup"],
        "plugins": ["line-numbers"],
        "theme": "twilight",
        "css": true
    }]
  ]
}

Each key are used as follows:

  • languages: Array of languages to include in the bundle. Those languages can be found here.
  • plugins: Array of plugins to include in the bundle. Those plugins can be found here.
  • theme: Name of theme to include in the bundle. Themes can be found here. Use lower-kebab-case for the theme name, e.g. solarized-light.
  • css: Boolean indicating whether to include .css files in the result. Defaults to false. If true, imports will be added for .css files. Must be true in order for theme to work.
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].