-
-
Notifications
You must be signed in to change notification settings - Fork 137
Expand file tree
/
Copy pathdiffcli.xhtml
More file actions
151 lines (151 loc) · 10.5 KB
/
Copy pathdiffcli.xhtml
File metadata and controls
151 lines (151 loc) · 10.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'>
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Pretty Diff - So its kind like recursive command line diff, but in
JavaScript</title>
<link href="../css/index.css" media="all" rel="stylesheet" type="text/css"/>
<link
href="http://prettydiff.com/guide/diffcli.xhtml"
rel="canonical"
type="application/xhtml+xml"/>
<link
href="http://prettydiff.com/images/favicon.ico"
rel="icon"
type="image/x-icon"/>
<link
href="http://prettydiff.com/labels.rdf"
rel="meta"
title="ICRA labels"
type="application/rdf+xml"/>
<meta content="width=device-width, initial-scale=1" name="viewport"/>
<meta content="index, follow" name="robots"/>
<meta
content="Pretty Diff - Guide, So its kind like recursive command line diff, but in JavaScript"
name="DC.title"/>
<meta
content="(pics-1.1 'http://www.icra.org/pics/vocabularyv03/' l gen true for 'http://prettydiff.com' r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 1) gen true for 'http://www.prettydiff.com' r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 1))"
http-equiv="pics-Label"/>
<meta content="Austin Cheney" name="author"/>
<meta
content="Pretty Diff tool can minify, beautify (pretty-print), or diff between minified and beautified code. This tool can even beautify and minify HTML."
name="description"/>
<meta content="Global" name="distribution"/>
<meta content="en" http-equiv="Content-Language"/>
<meta content="application/xhtml+xml;charset=UTF-8" http-equiv="Content-Type"/>
<meta content="blendTrans(Duration=0)" http-equiv="Page-Enter"/>
<meta content="blendTrans(Duration=0)" http-equiv="Page-Exit"/>
<meta content="text/css" http-equiv="content-style-type"/>
<meta content="application/javascript" http-equiv="content-script-type"/>
<meta
content="qL8AV9yjL2-ZFGV9ey6wU3t7pTZdpD4lIetUSiNen7E"
name="google-site-verification"/>
</head>
<body class="white" id="prettydiff">
<div class="contentarea" id="page">
<section role="heading">
<h1>
<svg height="2000.000000pt" id="pdlogo" preserveAspectRatio="xMidYMid meet" version="1.0" viewBox="0 0 2000.000000 2000.000000" width="2000.000000pt" xmlns="http://www.w3.org/2000/svg">
<g fill="#999" stroke="none" transform="translate(0.000000,2000.000000) scale(0.100000,-0.100000)">
<path
d="M14871 18523 c-16 -64 -611 -2317 -946 -3588 -175 -660 -319 -1202 -320 -1204 -2 -2 -50 39 -107 91 -961 876 -2202 1358 -3498 1358 -1255 0 -2456 -451 -3409 -1279 -161 -140 -424 -408 -560 -571 -507 -607 -870 -1320 -1062 -2090 -58 -232 -386 -1479 -2309 -8759 -148 -563 -270 -1028 -270 -1033 0 -4 614 -8 1365 -8 l1364 0 10 38 c16 63 611 2316 946 3587 175 660 319 1202 320 1204 2 2 50 -39 107 -91 543 -495 1169 -862 1863 -1093 1707 -568 3581 -211 4965 946 252 210 554 524 767 796 111 143 312 445 408 613 229 406 408 854 525 1320 57 225 380 1451 2310 8759 148 563 270 1028 270 1033 0 4 -614 8 -1365 8 l-1364 0 -10 -37z m-4498 -5957 c477 -77 889 -256 1245 -542 523 -419 850 -998 954 -1689 18 -121 18 -549 0 -670 -80 -529 -279 -972 -612 -1359 -412 -480 -967 -779 -1625 -878 -121 -18 -549 -18 -670 0 -494 74 -918 255 -1283 548 -523 419 -850 998 -954 1689 -18 121 -18 549 0 670 104 691 431 1270 954 1689 365 293 828 490 1283 545 50 6 104 13 120 15 72 10 495 -3 588 -18z"/></g>
</svg>
<a href="../index.xhtml">Pretty Diff</a>
- So its kind like recursive command line diff, but in JavaScript</h1>
<p id="dcolorScheme">
<label class="label" for="colorScheme">Color Scheme</label>
<select id="colorScheme">
<option>Canvas</option>
<option>Shadow</option>
<option selected="selected">White</option>
</select>
</p>
<p>Explore some
<a href="../samples.xhtml">samples</a>
or browse
<a href="https://github.com/prettydiff/prettydiff">Pretty Diff on GitHub</a>.</p>
</section>
<section role="main">
<h2>So its kind like recursive command line diff, but in JavaScript</h2>
<div class="segment">
<h3>Introduction</h3>
<p>Ye ol Unix diff application provides the means to compare changes of all
files in a directory tree. diff is awesome at its job, but it certainly isn't
Pretty Diff.</p>
<p>When used with Node.js
<a href="http://prettydiff.com/">Pretty Diff</a>
can now output diffs to the command line in color for entire directory trees
just like git diff. If you needed to compare an NPM package and all of its
dependencies, for example, to a prior version of that package now you can.
Changes in each modified file will be listed to the command line as well as
files removed and added.</p>
</div>
<div class="segment">
<h3>A brief example</h3>
<p>If I wanted to execute Pretty Diff from the command line with minimal effort
I could do the following:</p>
<code class="commandLine" data-prettydiff-ignore="true"><span>> cd prettydiff</span>
<span>> node api/node-local.js source:"../gulp" diff:"../gulpa"</span>
</code>
<p>The above command tells Node to execute
the file api/node-local.js file relatively from the Pretty Diff application. I
am going to pass in two arguments which are the source and something to compare
it to. In the following example there will be a change to a single line in one
file, which could look like the following:</p>
<code class="commandLine" data-prettydiff-ignore="true"><span class="meta">lib/somefile.js</span>
<span class="meta">Line 34</span>
<span> } else if (x[cc] === "[") {</span>
<span> block = "]";</span>
<span class="delete"> e<strong>e</strong> += <strong>1</strong>;</span>
<span class="insert"> e<strong>f</strong> += <strong>3</strong>;</span>
<span> dd += 1;</span>
<span> }</span>
</code>
<p>A line of code with two changes.</p>
</div>
<div class="segment">
<h3>How this executes</h3>
<p>The default presentation is to wrap each modification with two lines of
unchanged code to provide some context. This can be changed by passing in the
<em>context</em>
option. If the context option is provided a non-negative integer you get that
many lines of context, and if you provide any other value to this option you get
the entire file contents.</p>
<p>The output is written with just console.log by Node. The entire process is
asynchronous, except one point between the moment of reading files and
performing the code comparison. The application must sort and compare relative
paths to determine if a file is modified and thus needs a formal comparison or
is either deleted or inserted.</p>
<p>The node file supplied with Pretty Diff can auto-detect file types. This is
helpful if Pretty Diff is told to compare two resources but not told what those
resources are. If Pretty Diff is provided directories to compare and not told
how to read these resources with the
<em>readmethod</em>
option it will make the assumption that all files in all subdirectories should
be analyzed.</p>
<p>The command line output is the default behavior if the
<em>output</em>
option is omitted, which tells Pretty Diff where to save files of the diff
results. The command line output can also be forced if the
<em>diffcli</em>
option is provided with a value of "true".</p>
<p>The original intention of Pretty Diff is to be a language aware code analysis
tool, but this can be overridden as well. To perform traditional literal text
comparisons just pass in the option
<em>lang</em>
with a value of "text".</p>
<p>When I tested the application on a mutilated gulp module I was able to
perform several dozen comparisons from over a 1000 evaluated files around 1
second in time.</p>
<p>Using all these options on the command line may look something like:</p>
<code class="commandLine" data-prettydiff-ignore="true">> node api/node-local.js source:"../gulp" diff:"../gulpa" diffcli:"true" context:5 lang:"text" readmethod:"subdirectory"</code>
</div>
<p>For additional options check out the
<a href="../documentation.xhtml">documentation</a>. I take bug and suggestions for enhancements via email and at
<a href="https://github.com/austincheney/Pretty-Diff">Github</a>.</p>
</section>
</div>
<script src="../lib/global.js" type="application/javascript"></script>
<script src="../api/dom.js" type="application/javascript"></script>
</body>
</html>