UNPKG

vue-markdown-highlight

Version:

vue markdown highlight markdown vue 高亮插件

77 lines (52 loc) 2.42 kB
# vue-markdown-highlight [![license](https://img.shields.io/github/license/shudong/vue-markdown-highlight.svg?style=flat-square)](https://github.com/shudong/vue-markdown-highlight/blob/master/LICENSE) [![vue 2](https://img.shields.io/badge/vue-2-42b983.svg?style=flat-square)](https://vuejs.org) [![npm](https://img.shields.io/npm/v/vue-markdown-highlight.svg?style=flat-square)](https://www.npmjs.com/package/vue-markdown-highlight) [![npm](https://img.shields.io/npm/dt/vue-markdown-highlight.svg?style=flat-square)](https://www.npmjs.com/package/vue-markdown-highlight) [![Travis](https://img.shields.io/travis/shudong/vue-markdown-highlight.svg?style=flat-square)](https://travis-ci.org/shudong/vue-markdown-highlight) [![Codacy grade](https://img.shields.io/codacy/grade/3d15a7c11bfe47c69a2aed93cc67cc29.svg?style=flat-square)](https://www.codacy.com/app/shudong/vue-markdown-highlight) [![Gemnasium](https://img.shields.io/gemnasium/shudong/vue-markdown-highlight.svg?style=flat-square)](https://gemnasium.com/github.com/shudong/vue-markdown-highlight) [![ESLint Gluons](https://img.shields.io/badge/code%20style-shudong-9C27B0.svg?style=flat-square)](https://github.com/shudong/eslint-config-shudong) 📜 [Highlight.js](https://github.com/isagalaev/highlight.js) syntax highlighter component for [Vue](https://vuejs.org). https://github.com/wsdo/vue-markdown-highlight.git ## ⚙️ Installation **Via [NPM](https://www.npmjs.com):** [![NPM](https://nodei.co/npm/vue-markdown-highlight.png?downloads=true&downloadRank=true&stars=true)](https://www.npmjs.com/package/vue-markdown-highlight) 1. Install [**highlight.js**](https://github.com/isagalaev/highlight.js): ```bash npm i highlight.js ``` 2. Install **vue-markdown-highlight**: ```bash npm i vue-markdown-highlight -D ``` **Or [Yarn](https://yarnpkg.com):** 1. Install [**highlight.js**](https://github.com/isagalaev/highlight.js): ```bash yarn add highlight.js ``` 2. Install **Vue Highlight.js**: ```bash yarn add vue-markdown-highlight ``` ## 🛂 Usage **Main file:** ```javascript import 'highlight.js/styles/default.css'; import Highlight from 'vue-markdown-highlight' Vue.use(Highlight) ``` **Vue file:** ```vue <template> <div id="app"> <div v-html="content" v-highlight></div> </div> </template> <script> // JavaScript... </script> <style> /* StyleSheet... */ </style> ```