-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathgulpfile.js
71 lines (67 loc) · 2.29 KB
/
gulpfile.js
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
const gulp = require('gulp');
const less = require('gulp-less');
const transform = require('gulp-transform');
const rncss = require('./src/react-native-css');
const {
processStyleobject
} = require('./src/index');
const rename = require("gulp-rename");
const sourceDir = './example';
gulp.task('css', function () {
return gulp.src([`${sourceDir}/**/*.less`], {
base: sourceDir
})
.pipe(less({}))
.pipe(transform('utf8', (code) => {
try {
code = JSON.stringify(rncss(code), false, 4);
} catch (e) {
console.log(e);
}
console.log(code)
return code;
}))
.pipe(transform('utf8', (code) => {
try {
code = processStyleobject({
code,
hierarchy: false,
custom: function ({
root,
traverseProperty,
traverseStyle,
traverseChunk
}) {
// font-size:10 -> fontSize:Theme.font10
traverseProperty(root, function ({ value, property, selector }) {
if (property === 'fontSize') {
return `Theme.font${value}`;
}
});
// sort the keys
traverseStyle(root, function ({ style, selector, chunk, component }) {
const ret = {};
Object.keys(style).sort().forEach((key) => {
ret[key] = style[key];
});
return ret;
});
//print the chunks
traverseChunk(root, function ({ chunk, styleName, component }) {
});
}
});
} catch (e) {
console.log(e);
}
return code;
}))
.pipe(rename({
extname: '.less.js'
}))
.pipe(gulp.dest(sourceDir));
});
gulp.task('default', (() => {
gulp.start(['css']);
}));
gulp.watch(`${sourceDir}/**/*.less`, ['css']);