kylefang/gulp-angular-cloak
1
0
Fork 0
mirror of https://github.com/HackPlan/gulp-angular-cloak.git synced 2026-01-12 17:02:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

add customPrefixes to match cutom directives

Browse Source
This commit is contained in:
Gilad Peleg
2014-04-05 20:25:01 +03:00
parent b08282bffc
commit 330f3225f4
4 changed files with 87 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
fixtures/angular-custom.html Normal file
View File

@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>fixture</title>
</head>
<body>
<ui-router class="test"></ui-router>
<section gijo-loader="{{onLoad}}"></section>
</body>
</html>

23
index.js
View File

@@ -6,11 +6,28 @@ module.exports = function (params) {
//perhaps in the future
params = params || {};
var verbose = params.verbose || false;
var customPrefixes = params.customPrefixes || [];
//find ng-something by default
var prefix = 'ng-';
//optionally add custom prefixes
if (customPrefixes && customPrefixes.length) {
var additions = customPrefixes.join('|');
prefix += '|';
prefix += additions;
}
//wrap around to insert into replace str later
prefix = '(' + prefix + '){1}';
//build find/replace regex
//$1 -> allowable pre-chars
//$2 -> prefix match
//$3 -> actual directive (partially)
var replaceRegex = new RegExp('([\\s<\/]+)' + prefix + '(\\w+)', 'ig');
//find ng-something
var replaceRegex = /([\s<\/]+)ng-(\w+)/ig;
//replace with data-ng-something
var replaceStr = '$1data-ng-$2';
var replaceStr = '$1data-$2$3';
return through.obj(function (file, enc, cb) {
//pass through

19
readme.md
View File

@@ -40,6 +40,10 @@ ng-min is to creating minfiable Angular syntax.
<ng-directive></ng-directive>
<!-- self closing element -->
<ng-directive />
<!-- custom directive prefix -->
<ui-router></ui-router>
<!-- your name prefix -->
<gilad-cool-loader></gilad-cool-loader>
```
## Install
@@ -69,6 +73,18 @@ gulp.task('htmlify', function() {
params is an object that contains the following settings:
#### customPrefixes
Type: `Array`
An array to optionally add custom prefixes to the list of converted directives.
For example: `['ui-', 'gijo-']`
*Note: for this to work - you will need to make sure your directives **can** load with a `data-` prefix.*
Defaults to **[]**
#### verbose
Type: `Boolean`
@@ -81,7 +97,8 @@ Example usage:
```js
//...
.pipe(htmlify({
verbose:true
verbose:true,
customPrefixes: ['ui-']
}))
// --> [gulp] Found and replaced ng-directives in index.html
//...

32
test.js
View File

@@ -111,3 +111,35 @@ it('should not change anything other than angular directives', function (cb) {
stream.end();
});
it('should work with custom prefixes', function (cb) {
var stream = htmlify({
customPrefixes: ['ui-', 'gijo-']
});
var filename = './fixtures/angular-custom.html';
stream.on('data', function (file) {
//make sure ng-app turned into data-ng-app
var contents = file.contents.toString('utf8');
//test that ui-router is handled
assert(/data-ui-router/.test(contents));
assert(!/[^-]ui-router/.test(contents));
//test that data-ng appears
assert(/\s+data-gijo-loader/.test(contents));
assert(!/\s+gijo-loader/.test(contents));
});
stream.on('end', cb);
var testFile = fs.readFileSync(filename);
stream.write(new gutil.File({
path: filename,
cwd: '.',
contents: new Buffer(testFile.toString())
}));
stream.end();
});