7
7
[ ![ npm] ( https://img.shields.io/npm/v/diff2html.svg )] ( https://www.npmjs.com/package/diff2html )
8
8
[ ![ Dependency Status] ( https://david-dm.org/rtfpessoa/diff2html.svg )] ( https://david-dm.org/rtfpessoa/diff2html )
9
9
[ ![ devDependency Status] ( https://david-dm.org/rtfpessoa/diff2html/dev-status.svg )] ( https://david-dm.org/rtfpessoa/diff2html#info=devDependencies )
10
- [ ![ cdnjs ] ( https://img.shields.io/cdnjs/v/ diff2html )] ( https://cdnjs. com/libraries /diff2html )
10
+ [ ![ jsdelivr CDN Downloads ] ( https://data.jsdelivr.com/v1/package/npm/ diff2html/badge )] ( https://www.jsdelivr. com/package/npm /diff2html )
11
11
12
12
[ ![ node] ( https://img.shields.io/node/v/diff2html.svg )] ( ) [ ![ npm] ( https://img.shields.io/npm/l/diff2html.svg )] ( )
13
13
[ ![ npm] ( https://img.shields.io/npm/dm/diff2html.svg )] ( https://www.npmjs.com/package/diff2html )
@@ -65,42 +65,46 @@ diff2html generates pretty HTML diffs from git diff or unified diff output.
65
65
66
66
## Online Example
67
67
68
- > Go to [ diff2html] ( https://diff2html.xyz/ )
68
+ > Go to [ diff2html] ( https://diff2html.xyz/demo.html )
69
69
70
70
## Distributions
71
71
72
+ - [ jsdelivr CDN] ( https://www.jsdelivr.com/package/npm/diff2html )
72
73
- [ WebJar] ( http://www.webjars.org/ )
73
74
- [ Node Library] ( https://www.npmjs.org/package/diff2html )
74
75
- [ NPM CLI] ( https://www.npmjs.org/package/diff2html-cli )
75
- - Manually download and import :
76
+ - Manually use from jsdelivr or build the project :
76
77
- Browser / Bundle
77
78
- Parser and HTML Generator
78
- - [ bundles/js/diff2html.min.js] ( ./bundles/js/diff2html.min.js ) - includes the diff parser and html generator
79
+ - [ bundles/js/diff2html.min.js] ( https://cdn.jsdelivr.net/npm/diff2html/bundles/js/diff2html.min.js ) - includes the
80
+ diff parser and html generator
79
81
- Wrapper and helper adding syntax highlight, synchronized scroll, and other nice features
80
- - [ bundles/js/diff2html-ui.min.js] ( ./ bundles/js/diff2html-ui.min.js) - includes the wrapper of diff2html with
81
- highlight for all ` highlight.js ` supported languages
82
- - [ bundles/js/diff2html-ui-slim.min.js] ( ./ bundles/js/diff2html-ui-slim.min.js) - includes the wrapper of diff2html
83
- with "the most common" ` highlight.js ` supported languages
84
- - [ bundles/js/diff2html-ui-base.min.js] ( ./ bundles/js/diff2html-ui-base.min.js) - includes the wrapper of diff2html
85
- without including a ` highlight.js ` implementation. You can use it without syntax highlight or by passing your
86
- own implementation with the languages you prefer
82
+ - [ bundles/js/diff2html-ui.min.js] ( https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui.min.js) -
83
+ includes the wrapper of diff2html with highlight for all ` highlight.js ` supported languages
84
+ - [ bundles/js/diff2html-ui-slim.min.js] ( https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui-slim.min.js) -
85
+ includes the wrapper of diff2html with "the most common" ` highlight.js ` supported languages
86
+ - [ bundles/js/diff2html-ui-base.min.js] ( https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui-base.min.js) -
87
+ includes the wrapper of diff2html without including a ` highlight.js ` implementation. You can use it without
88
+ syntax highlight or by passing your own implementation with the languages you prefer
87
89
- NPM / Node.js library
88
90
- ES5
89
- - [ lib/diff2html.js] ( ./lib/diff2html.js ) - includes the diff parser and html generator
90
- - [ lib/ui/js/diff2html-ui.js] ( ./lib/ui/js/diff2html-ui.js ) - includes the wrapper of diff2html with highlight for
91
- all ` highlight.js ` supported languages
92
- - [ lib/ui/js/diff2html-ui-slim.js] ( ./lib/ui/js/diff2html-ui-slim.js ) - includes the wrapper of diff2html with "the
93
- most common" ` highlight.js ` supported languages
94
- - [ lib/ui/js/diff2html-ui-base.js] ( ./lib/ui/js/diff2html-ui-base.js )
91
+ - [ lib/diff2html.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/diff2html.js ) - includes the diff parser and html
92
+ generator
93
+ - [ lib/ui/js/diff2html-ui.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui.js ) - includes the
94
+ wrapper of diff2html with highlight for all ` highlight.js ` supported languages
95
+ - [ lib/ui/js/diff2html-ui-slim.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui-slim.js ) -
96
+ includes the wrapper of diff2html with "the most common" ` highlight.js ` supported languages
97
+ - [ lib/ui/js/diff2html-ui-base.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui-base.js )
95
98
- ES6
96
- - [ lib-esm/diff2html.js] ( ./lib-esm/diff2html.js ) - includes the diff parser and html generator
97
- - [ lib/ui/js/diff2html-ui.js] ( ./lib/ui/js/diff2html-ui.js ) - includes the wrapper of diff2html with highlight for
98
- all ` highlight.js ` supported languages
99
- - [ lib/ui/js/diff2html-ui-slim.js] ( ./lib/ui/js/diff2html-ui-slim.js ) - includes the wrapper of diff2html with "the
100
- most common" ` highlight.js ` supported languages
101
- - [ lib/ui/js/diff2html-ui-base.js] ( ./lib/ui/js/diff2html-ui-base.js ) - includes the wrapper of diff2html without
102
- including a ` highlight.js ` implementation. You can use it without syntax highlight or by passing your own
103
- implementation with the languages you prefer
99
+ - [ lib-esm/diff2html.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib-esm/diff2html.js ) - includes the diff parser
100
+ and html generator
101
+ - [ lib/ui/js/diff2html-ui.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui.js ) - includes the
102
+ wrapper of diff2html with highlight for all ` highlight.js ` supported languages
103
+ - [ lib/ui/js/diff2html-ui-slim.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui-slim.js ) -
104
+ includes the wrapper of diff2html with "the most common" ` highlight.js ` supported languages
105
+ - [ lib/ui/js/diff2html-ui-base.js] ( https://cdn.jsdelivr.net/npm/diff2html/lib/ui/js/diff2html-ui-base.js ) -
106
+ includes the wrapper of diff2html without including a ` highlight.js ` implementation. You can use it without
107
+ syntax highlight or by passing your own implementation with the languages you prefer
104
108
105
109
## Usage
106
110
@@ -121,11 +125,9 @@ Import the stylesheet
121
125
122
126
``` html
123
127
<!-- CSS -->
124
- <link rel =" stylesheet" type =" text/css" href =" bundles/css/diff2html.min.css" />
128
+ <link rel =" stylesheet" type =" text/css" href =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/css/diff2html.min.css" />
125
129
```
126
130
127
- You can also refer to it from a CDN like [ CDNJS] ( https://cdnjs.com/libraries/diff2html ) .
128
-
129
131
### Diff2Html API
130
132
131
133
> JSON representation of the diff
@@ -140,8 +142,6 @@ function parse(diffInput: string, configuration: Diff2HtmlConfig = {}): DiffFile
140
142
function html(diffInput : string | DiffFile [], configuration : Diff2HtmlConfig = {}): string ;
141
143
```
142
144
143
- > Check out the [ docs/demo.html] ( ./docs/demo.html ) for a demo example.
144
-
145
145
### Diff2Html Configuration
146
146
147
147
The HTML output accepts a Javascript object with configuration. Possible options:
@@ -170,10 +170,10 @@ Import the stylesheet and the library code
170
170
171
171
``` html
172
172
<!-- CSS -->
173
- <link rel =" stylesheet" type =" text/css" href =" bundles/css/diff2html.min.css" />
173
+ <link rel =" stylesheet" type =" text/css" href =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/css/diff2html.min.css" />
174
174
175
175
<!-- Javascripts -->
176
- <script type =" text/javascript" src =" bundles/js/diff2html.min.js" ></script >
176
+ <script type =" text/javascript" src =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html.min.js" ></script >
177
177
```
178
178
179
179
It will now be available as a global variable named ` Diff2Html ` .
@@ -310,8 +310,6 @@ fileListToggle(startVisible: boolean): void
310
310
highlightCode (): void
311
311
```
312
312
313
- > Check out the [ docs/demo.html] ( ./docs/demo.html ) for a demo example.
314
-
315
313
### Diff2HtmlUI Configuration
316
314
317
315
- ` synchronisedScroll ` : scroll both panes in side-by-side mode: ` true ` or ` false ` , default is ` true `
@@ -327,10 +325,10 @@ highlightCode(): void
327
325
328
326
``` html
329
327
<!-- CSS -->
330
- <link rel =" stylesheet" type =" text/css" href =" bundles/css/diff2html.min.css" />
328
+ <link rel =" stylesheet" type =" text/css" href =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/css/diff2html.min.css" />
331
329
332
330
<!-- Javascripts -->
333
- <script type =" text/javascript" src =" bundles/js/diff2html-ui.min.js" ></script >
331
+ <script type =" text/javascript" src =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui.min.js" ></script >
334
332
```
335
333
336
334
#### Init
@@ -355,10 +353,10 @@ diff2htmlUi.draw();
355
353
``` html
356
354
<!-- Stylesheet -->
357
355
<link rel =" stylesheet" href =" https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/github.min.css" />
358
- <link rel =" stylesheet" type =" text/css" href =" bundles/css/diff2html.min.css" />
356
+ <link rel =" stylesheet" type =" text/css" href =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/css/diff2html.min.css" />
359
357
360
358
<!-- Javascripts -->
361
- <script type =" text/javascript" src =" bundles/js/diff2html-ui.min.js" ></script >
359
+ <script type =" text/javascript" src =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui.min.js" ></script >
362
360
```
363
361
364
362
> Pass the option ` highlight ` with value true or invoke ` diff2htmlUi.highlightCode() ` after ` diff2htmlUi.draw() ` .
@@ -386,7 +384,7 @@ index 0000001..0ddf2ba
386
384
387
385
``` html
388
386
<!-- Javascripts -->
389
- <script type =" text/javascript" src =" bundles/js/diff2html-ui.min.js" ></script >
387
+ <script type =" text/javascript" src =" https://cdn.jsdelivr.net/npm/diff2html/ bundles/js/diff2html-ui.min.js" ></script >
390
388
```
391
389
392
390
> Invoke the Diff2HtmlUI helper Pass the option ` fileListToggle ` with value true or invoke
0 commit comments