feat:初始化项目

2021-08-23 22:05:46 +08:00
commit ca52cf1bc0
@@ -0,0 +1,57 @@
+var md5 = require('crypto-md5');
+var path = require('path');
+var rd = require('rd');
+var fs = require('fs');
+var _ = require('lodash');
+
+function changed(dir) {
+
+    var manifestPath = path.resolve('./src/manifest.json');
+    var manifest = {};
+    var originManifest = {};
+
+    //如果存在 manifest.json, 则加载保存
+    if (fs.existsSync(manifestPath)) {
+        originManifest = require(manifestPath);
+    }
+
+    //遍历目录, 根据内容 md5 加密
+    rd.eachFileFilterSync(dir, function (file) {
+        var index = path.relative(dir, file);
+
+        //过滤掉 隐藏文件 和 manifest.json
+        if (path.extname(file) && index !== 'manifest.json' && fs.existsSync(file)) {
+
+            var data = fs.readFileSync(file);
+
+            if (data) {
+                manifest[index] = md5(data, 'hex');
+            }
+        }
+
+    });
+
+    //将新的 manifest.json 保存
+    fs.writeFile(manifestPath, JSON.stringify(manifest), function (err) {
+        if (err) throw err;
+    });
+
+    //找出有变动的文件
+    if(originManifest){
+        var diff = {};
+
+        _.forEach(manifest, function (item, index) {
+            if (originManifest[index] !== item) {
+                diff[index] = item;
+            }
+        });
+    }
+
+    return diff;
+
+}
+
+
+module.exports = function(){
+    return changed;
+};
@@ -0,0 +1,161 @@
+/**
+ * Created by doubleluo
+ */
+var gulp = require('gulp');
+var replace = require('gulp-replace');
+var through = require('through2');
+var fs = require('fs');
+var path = require('path');
+var File = require('vinyl');
+var util = require('../lib/util');
+var cheerio = require('cheerio');
+
+module.exports = function (options) {
+
+    var mkdirs = function(dirpath, callback) {
+        fs.exists(dirpath, function(exists) {
+            if(exists) {
+                callback(dirpath);
+            } else {
+                mkdirs(path.dirname(dirpath), function(){
+                    fs.mkdir(dirpath, callback);
+                });
+            }
+        });
+    }
+
+    var mkdirone = false;
+    var marchRegInline = /<img.*?src=['"].*?(\w+)\.svg\?i['"].*?>/gi;
+    var marchRegSybmol = /<img.*?src=['"].*?(\w+)\.svg\?s['"].*?>/gi;
+    var marchRegBase = /<img.*?src=['"].*?(\w+)\.svg['"].*?>/gi;
+    var src = [],id,style,className,data,width,height,newcontent,$;
+
+    function getBase(){
+        id = $.attr('id');
+        style = $.attr('style');
+        className = $.attr('class');
+        data = fs.readFileSync(path.join(process.cwd(), options.devPath+'/img', src[0])).toString();
+        width =  data.match(/<svg(.*?)width=["|'](.*?)(px)?["|']/)[2];
+        height =  data.match(/<svg(.*?)height=["|'](.*?)(px)?["|']/)[2];
+        fileName = src[0].substr(src[0].lastIndexOf('/')+1,src[0].indexOf('.svg')-7);
+        newcontent = [];
+    }
+
+    function getAttr(){
+        if(id){
+            newcontent.push(' id="'+ id +'"');
+        }
+        if(style){
+            newcontent.push(' style="'+ style +'"');
+        }
+        if(className){
+            newcontent.push(' class="'+ className +'"');
+        }
+    }
+
+    function inline(contents){
+        getAttr();
+        data = data.replace('<svg','<svg width="'+ width +'" height="'+ height +'"'+newcontent.join(''));
+        if(options.SVGGracefulDegradation){
+            data = data.replace('>','><image width="'+ width +'" height="'+ height +'" src="'+src[0].replace('.svg','.png')+'" />');
+        }
+        return data;
+    }
+    function sybmol(contents){
+        var newFile = path.join(process.cwd(), options.devPath + '/symboltemp/', fileName);
+        fs.writeFile(newFile, data, {encoding: 'utf8'}, err => {
+            if (err) throw err;
+        });
+        newcontent.push('<svg width="'+ width +'" height="'+ height +'" xmlns="http://www.w3.org/2000/svg"');
+        getAttr();
+        newcontent.push('>');
+        if(options.SVGGracefulDegradation){
+            newcontent.push('<image src="'+src[0].replace('.svg','.png')+'"',' />');
+        }
+        newcontent.push('<use xlink:href="'+ ((options && options.symbolBaseUrl)||'../symbolsvg/symbol.svg')+ '#' + fileName.replace('.svg','') +'"/>');
+        newcontent.push('</svg>');
+        return newcontent.join('');
+    }
+    function base(contents){
+        newcontent.push('<svg width="'+ width +'" height="'+ height +'" xmlns="http://www.w3.org/2000/svg"');
+        getAttr();
+        newcontent.push('>');
+        if(options.SVGGracefulDegradation){
+            newcontent.push('<image width="'+ width +'" height="'+ height +'" src="'+src[0].replace('.svg','.png')+'" xlink:href="'+src[0]+'">');
+        }else{
+            newcontent.push('<image width="'+ width +'" height="'+ height +'" xlink:href="'+src[0]+'">');
+        }
+        newcontent.push('</svg>');
+        return newcontent.join('');
+    }
+
+    function run(regData,contents,marchReg){
+        if(regData){
+            for(var i = 0;i<regData.length;i++){
+                var replaceData = '';
+                $ = cheerio(regData[i]);
+                src = $.attr('src').split('?');
+                if(src[0].indexOf('.svg')>-1){
+                    getBase();
+                    if(src[1] == 'i'){
+                        replaceData = inline(contents);
+                    }else if(src[1] == 's'){
+                        replaceData = sybmol(contents);
+                    }else{
+                        replaceData = base(contents);
+                    }
+                }
+                
+                contents = contents.replace(regData[i], replaceData);
+
+            }
+        }
+        return contents;
+    }
+
+    return through.obj(function (file, enc, cb) {
+
+        var _this = this;
+        
+
+        if (file.isNull()) {
+            cb(null, file);
+        } else {
+            if (util.fileExist(file.path)) {
+                var contents = file.contents.toString();
+                var regData;
+                if(options.onlyInline){
+                    regData = contents.match(marchRegInline);
+                    contents = run(regData,contents,marchRegInline);
+                }else{
+                    if(!mkdirone){
+                        mkdirone = true;
+                        fs.exists(process.cwd() + '/'+ options.devPath +'/symboltemp',function(exists){
+                            if(!exists){
+                                fs.mkdir(process.cwd() + '/'+ options.devPath +'/symboltemp', err => {
+                                    if (err) throw err;
+                                });
+                            }
+                        });
+                    }
+                    regData = contents.match(marchRegInline);
+                    contents = run(regData,contents,marchRegInline);
+                    regData = contents.match(marchRegSybmol);
+                    contents = run(regData,contents,marchRegSybmol);
+                    regData = contents.match(marchRegBase);
+                    contents = run(regData,contents,marchRegBase);
+                }
+                
+
+                _this.push(new File({
+                    base: file.base,
+                    path: file.path,
+                    contents: new Buffer(contents)
+                }));
+                cb(null);
+            } else {
+                cb(null, file);
+            }
+        }
+    });
+}
@@ -0,0 +1,36 @@
+/**
+ * Created by doubleluo on 15/5/3.
+ */
+var gulp = require('gulp');
+var replace = require('gulp-replace');
+var through = require('through2');
+var fs = require('fs');
+var path = require('path');
+var util = require('../lib/util');
+var File = require('vinyl');
+var svg_to_png = require('svg-to-png');
+
+module.exports = function (options) {
+	return through.obj(function (file, enc, cb) {
+
+        var _this = this;
+        
+
+        if (file.isNull()) {
+            cb(null, file);
+        } else {
+            if (util.fileExist(file.path)) {
+            	svg_to_png.convert(file.path, file.path.substr(0,file.path.lastIndexOf('/')).replace('/src/','/dist/'));
+
+                _this.push(new File({
+                    base: file.base,
+                    path: file.path,
+                    contents: file.contents
+                }));
+                cb(null);
+            } else {
+                cb(null, file);
+            }
+        }
+    });
+}
@@ -0,0 +1,86 @@
+/**
+ * Created by littledu on 15/5/2.
+ */
+var rd = require('rd');
+var gulp = require('gulp');
+var path = require('path');
+var gulpWebp = require('gulp-webp');
+var rename = require('gulp-rename');
+var replace = require('gulp-replace');
+var util = require('./../lib/util');
+var fs = require('fs');
+
+module.exports = function (config, done) {
+
+    var webpScript = '<script>function webpsupport(a){var c=window.localStorage;if(typeof a!="function"){a=function(){}}if(c!=undefined&&c._tmtwebp!=undefined&&c._tmtwebp==0){a();return false}else{if(c!=undefined&&c._tmtwebp!=undefined&&c._tmtwebp==1){a(1);return true}else{var f=new Image();f.onload=f.onerror=function(){if(f.height!=2){if(c!=undefined){c._tmtwebp=0}a();return false}else{if(c!=undefined){c._tmtwebp=1}a(1);return true}};f.src="data:image/webp;base64,UklGRjoAAABXRUJQVlA4IC4AAACyAgCdASoCAAIALmk0mk0iIiIiIgBoSygABc6WWgAA/veff/0PP8bA//LwYAAA"}}};;(function(){function b(t){var f=document.getElementsByTagName("link");for(var e=0,d=f.length;e<d;e++){if(t){f[e].href=f[e].getAttribute("data-href").replace(".css",".webp.css");}else{f[e].href=f[e].getAttribute("data-href")}}}webpsupport(b);})();</script></head>';
+
+    var webpMap = {};    //为了筛选webp而构建的对象
+    var imgArr = [];     //筛选出来需要转换成 webp 的图片
+    var imgMap = {};     //返回给全局作 preload 判断使用{"img_name": 1, "img_name": 0} 1 为可优化成 webp
+    var reg = null;
+
+    function render_webp(src) {
+        if (!fs.existsSync(src)) return;
+
+        rd.eachFileSync(src, function (file, stats) {
+            var extname = path.extname(file);
+            var basename = path.basename(file, extname);
+            if (!(basename in webpMap)) {
+                webpMap[basename] = {};
+                webpMap[basename]['size'] = stats.size;
+                webpMap[basename]['extname'] = extname;
+            } else {
+                if ((webpMap[basename]['size'] > stats.size) && (extname === '.webp')) {
+                    imgArr.push(basename + webpMap[basename]['extname']);
+                    imgMap[basename + webpMap[basename]['extname']] = 1;
+                } else {
+                    imgMap[basename + webpMap[basename]['extname']] = 0;
+                }
+            }
+        });
+    }
+
+    return function () {
+        return gulp.series(
+            function compileSprite() {
+                return gulp.src('./tmp/sprite/**/*')
+                    .pipe(gulpWebp())
+                    .pipe(gulp.dest('./tmp/sprite'));
+            },
+            function compileImg () {
+                return gulp.src('./tmp/img/**/*')
+                    .pipe(gulpWebp())
+                    .pipe(gulp.dest('./tmp/img'));
+            },
+            //智能寻找 webp
+            function find2Webp (cb) {
+                render_webp('./tmp/sprite');
+                render_webp('./tmp/img');
+                if(imgArr.length){
+                    reg = eval('/(' + imgArr.join('|') + ')/ig');
+                }
+                cb();
+            },
+            function compileCss () {
+                return gulp.src(['./tmp/css/**/*.css', '!./tmp/css/**/*.webp.css'])
+                    .pipe(rename({suffix: '.webp'}))
+                    .pipe(replace(reg, function (match) {
+                        if(match){
+                            return match.substring(0, match.lastIndexOf('.')) + '.webp';
+                        }
+                    }))
+                    .pipe(gulp.dest('./tmp/css'));
+            },
+            function insertWebpJs () {
+                var preload_script = '<script>window.imgMap = ' + JSON.stringify(imgMap) + '</script>';
+
+                return gulp.src('./tmp/html/**/*.html')
+                    .pipe(replace('data-href', 'href'))
+                    .pipe(replace(/(link.*?)href/ig, '$1data-href'))
+                    .pipe(replace('</head>', webpScript))
+                    .pipe(replace('</head>', preload_script))
+                    .pipe(gulp.dest('./tmp/html'));
+            }
+        );
+    }
+}