source-fragment
Fetch source file fragment with highlighting
Install
npm install source-fragment
Example
Suppose we have the code (example.js
):
function hello() {
return (
'world' +
'!!!'
);
}
To get colored fragment of this code:
var sf = require('source-fragment');
console.log(sf('example.js:2:12:5:6', { format: 'tty' }));
You'll see in console:
The same but in HTML
format:
sf('example.js:2:12:5:6', { format: 'html' });
// <div class="j5as83pdmd85mv2c-source">
// <style>...</style>
// <div class="j5as83pdmd85mv2c-line"><span class="j5as83pdmd85mv2c-num">Â Â 2</span>...</div>
// ...
// </div>
When pasted on HTML page looks like:
API
sourceFragment(loc[, options])
Options:
-
format
Type:
Object
Default:null
(no format is used)Defines formatter for a result. There are two predefined formats, that can be choosen by name (e.g.
sourceFragment('...', { format: 'html' })
):-
html
- formats result in HTML -
tty
– formats result using terminal escape codes, useful to output in console with color support
-
-
linesBefore
Type:
Number
Default:0
Lines added before a range start line.
-
linesAfter
Type:
Number
Default:0
Lines added after a range end line.
-
maxLines
Type:
Number
Default:Infinity
Limits lines number in result.
-
collapseOffset
Type:
Boolean
Default:false
Cut off common offset in resulting fragment, i.e. move source to the left as much as possible.
-
tabSize
Type:
Number
Default:8
Number of spaces that used as tab replacement, i.e. tabs in source replaces for 8 spaces by default.
Related projects
-
express-source-fragment –
Express
middleware to fetch a source fragment by request to server. -
Component Inspector – developer tool to inspect components that can open component creation source location in editor. Has integrations for
React
,Backbone
and can be adopted for other frameworks.
License
MIT