Skip to content

Commit 8965ebe

Browse files
joshgoebeljoshgoebel
authored
(parser) Add basic Vue.js component and examples. (highlightjs#2544)
- add basic Vue.js component - add simple usage case to the README - eat our own dogfood with `tools/developer.html` now using the Vue plugin just for fun
1 parent bf5b797 commit 8965ebe

File tree

6 files changed

+12077
-8
lines changed

6 files changed

+12077
-8
lines changed

‎CHANGES.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,18 @@ New themes:
44

55
- *Gradient Light* by [Samia Ali]()
66

7+
Big picture:
8+
9+
- Add simple Vue plugin for basic use cases (#2544) [Josh Goebel][]
10+
711
Language Improvements:
812

913
- enh(matlab) Add new R2019b `arguments` keyword and fix `enumeration` keyword (#2619) [Andrew Janke][]
1014
- fix(kotlin) Remove very old keywords and update example code (#2623) [kageru][]
1115
- fix(night) Prevent object prototypes method values from being returned in `getLanguage` (#2636) [night][]
1216
- enh(java) Add support for `enum`, which will identify as a `class` now (#2643) [ezksd][]
1317

18+
[Josh Goebel]: https://github.com/yyyc514
1419
[Andrew Janke]: https://github.com/apjanke
1520
[Samia Ali]: https://github.com/samiaab1990
1621
[kageru]: https://github.com/kageru

‎README.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,26 @@ document.querySelectorAll('div.code').forEach((block) => {
9797
For other options refer to the documentation for [`configure`][4].
9898

9999

100+
## Using with Vue.js
101+
102+
Simply register the plugin with Vue:
103+
104+
```js
105+
Vue.use(hljs.vuePlugin);
106+
```
107+
108+
And you'll be provided with a `highlightjs` component for use
109+
in your templates:
110+
111+
```html
112+
<div id="app">
113+
<!-- bind to a data property named `code` -->
114+
<highlightjs autodetect :code="code" />
115+
<!-- or literal code works as well -->
116+
<highlightjs language='javascript' code="var x = 5;" />
117+
</div>
118+
```
119+
100120
## Web Workers
101121

102122
You can run highlighting inside a web worker to avoid freezing the browser

0 commit comments

Comments
 (0)