|
|
@@ -18,77 +18,21 @@ let path = require('path');
|
|
|
let pretty = require('pretty-bytes');
|
|
|
let shell = require('shelljs');
|
|
|
let runSequence = require('run-sequence');
|
|
|
-let watchPath = require('gulp-watch-path');
|
|
|
-let gcallback = require('gulp-callback');
|
|
|
-let crypto = require('crypto');
|
|
|
-// 顶部导航栏
|
|
|
-let navbar = require('./static/js/navbar.js');
|
|
|
-
|
|
|
-// 可以特定的编译某个工具,开发过程中用,可以提高编译速度
|
|
|
-let singleTool = '';
|
|
|
|
|
|
gulp.task('clean', () => {
|
|
|
- if (require('os').hostname() === 'www-baidufe-com') {
|
|
|
- return console.log('当心,别乱来!不允许在服务器上直接编译!');
|
|
|
- }
|
|
|
-
|
|
|
- let args = process.argv.slice(2);
|
|
|
- if (args.length === 2 && args[0] === '--t') {
|
|
|
- return gulp.src('output', {read: false});
|
|
|
- } else {
|
|
|
- return gulp.src('output', {read: false}).pipe(clean({force: true}));
|
|
|
- }
|
|
|
+ return gulp.src('output', {read: false}).pipe(clean({force: true}));
|
|
|
});
|
|
|
|
|
|
gulp.task('copy', () => {
|
|
|
- return gulp.src(['fehelper/**/*.{gif,png,jpg,jpeg,cur,ico}']).pipe(copy('output'));
|
|
|
+ return gulp.src(['apps/**/*.{gif,png,jpg,jpeg,cur}', '!apps/static/screenshot/**/*']).pipe(copy('output'));
|
|
|
});
|
|
|
|
|
|
gulp.task('json', () => {
|
|
|
- return gulp.src('fehelper/**/*.json').pipe(jsonmin()).pipe(gulp.dest('output/fehelper'));
|
|
|
+ return gulp.src('apps/**/*.json').pipe(jsonmin()).pipe(gulp.dest('output/apps'));
|
|
|
});
|
|
|
|
|
|
gulp.task('html', () => {
|
|
|
-
|
|
|
- // 头部公共的meta标签,SEO用
|
|
|
- let metas = `<meta name="Robots" content="INDEX,FOLLOW">
|
|
|
- <meta name="keywords" content="FeHelper,WEB前端助手,JSON格式化,JSON对比,信息编解码,代码美化,代码压缩,二维码生成,二维码解码,图片Base64转换,Markdown,随机密码生成器,正则表达式,时间戳转换,便签笔记,进制转换,贷款计算器">
|
|
|
- <meta name="description" content="WEB前端助手:FeHelper,浏览器插件,包含一些前端实用的工具,如JSON格式化,JSON对比,信息编解码,代码美化,代码压缩,二维码生成,二维码解码,图片Base64转换,Markdown,随机密码生成器,正则表达式,时间戳转换,便签笔记,进制转换,贷款计算器等">
|
|
|
- <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/pkgccpejnmalmdinmhkkfafefagiiiad">
|
|
|
- <meta name="renderer" content="webkit">
|
|
|
- <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">`;
|
|
|
-
|
|
|
- // 百度统计代码
|
|
|
- let baiduTj = `<div id="pageFooter" class="hide" style="display: none">
|
|
|
- <script type="text/javascript">
|
|
|
- (function(){
|
|
|
- var _bdhmProtocol = (("https:" === document.location.protocol) ? " https://" : " http://");
|
|
|
- document.write(unescape("%3Cscript src='" + _bdhmProtocol +
|
|
|
- "hm.baidu.com/h.js%3F17b02fba4e62901b4289eef4c2243123' type='text/javascript'%3E%3C/script%3E"));
|
|
|
- })();
|
|
|
- </script>
|
|
|
- </div>`.replace(/\n+|\s{2,}/gm, ' ');
|
|
|
-
|
|
|
- let tplInsert = () => {
|
|
|
- return through.obj(function (file, enc, cb) {
|
|
|
- let contents = file.contents.toString('utf-8');
|
|
|
-
|
|
|
- let insert = (fp, fc) => {
|
|
|
- return fc.replace(/<\/title>/gm, `</title>${metas}`) // meta标签-seo
|
|
|
- .replace(/id="pageContainer"[^>]*>/gm, function (frag) { // 顶部导航栏
|
|
|
- return frag + navbar.htmlHeader;
|
|
|
- }).replace(/<\/body>/gm, `${baiduTj}</body>`) // 百度统计
|
|
|
- .replace(`<script src="../static/js/navbar.js"></script>`, ''); // 删掉navbar.js的引用
|
|
|
- };
|
|
|
-
|
|
|
- contents = insert(file.path, contents);
|
|
|
- file.contents = new Buffer.from(contents);
|
|
|
- this.push(file);
|
|
|
- return cb();
|
|
|
- });
|
|
|
- };
|
|
|
-
|
|
|
- return gulp.src(`fehelper${singleTool}/**/*.html`).pipe(tplInsert()).pipe(htmlmin({collapseWhitespace: true})).pipe(gulp.dest(`output/fehelper${singleTool}`));
|
|
|
+ return gulp.src('apps/**/*.html').pipe(htmlmin({collapseWhitespace: true})).pipe(gulp.dest('output/apps'));
|
|
|
});
|
|
|
|
|
|
// 合并 & 压缩 js
|
|
|
@@ -97,30 +41,14 @@ gulp.task('js', () => {
|
|
|
return through.obj(function (file, enc, cb) {
|
|
|
let contents = file.contents.toString('utf-8');
|
|
|
|
|
|
- let tpl = 'let #VARNAME# = (function(module){ #CODES# ; return module.exports; })({exports:{}});\r\n';
|
|
|
-
|
|
|
let merge = (fp, fc) => {
|
|
|
- let js = {};
|
|
|
|
|
|
// 合并 __importScript
|
|
|
- fc = fc.replace(/__importScript\(\s*(['"])([^'"]*)\1\s*\)/gm, function (frag, $1, mod) {
|
|
|
+ return fc.replace(/__importScript\(\s*(['"])([^'"]*)\1\s*\)/gm, function (frag, $1, mod) {
|
|
|
let mp = path.resolve(fp, '../' + mod + (/\.js$/.test(mod) ? '' : '.js'));
|
|
|
let mc = fs.readFileSync(mp).toString('utf-8');
|
|
|
return merge(mp, mc + ';');
|
|
|
});
|
|
|
-
|
|
|
- let rfc = fc.replace(/Tarp\.require\(\s*(['"])([^'"]+)\1\s*\)/gm, function (frag, $1, mod, $2, code) {
|
|
|
- let mp = path.resolve(fp, '../' + mod + (/\.js$/.test(mod) ? '' : '.js'));
|
|
|
- let mc = fs.readFileSync(mp).toString('utf-8');
|
|
|
-
|
|
|
- frag = frag.replace(/[^\w]/g, '').replace('Tarprequire', 'TR');
|
|
|
- js[frag] = merge(mp, mc);
|
|
|
- return frag;
|
|
|
- });
|
|
|
-
|
|
|
- return Object.keys(js).map(k => {
|
|
|
- return tpl.replace('#VARNAME#', k).replace('#CODES#', () => js[k]);
|
|
|
- }).join('; ') + rfc;
|
|
|
};
|
|
|
|
|
|
contents = merge(file.path, contents);
|
|
|
@@ -130,7 +58,7 @@ gulp.task('js', () => {
|
|
|
})
|
|
|
};
|
|
|
|
|
|
- return gulp.src(`fehelper${singleTool}/**/*.js`).pipe(jsMerge()).pipe(uglifyjs()).pipe(gulp.dest(`output/fehelper${singleTool}`));
|
|
|
+ return gulp.src('apps/**/*.js').pipe(jsMerge()).pipe(uglifyjs()).pipe(gulp.dest('output/apps'));
|
|
|
});
|
|
|
|
|
|
// 合并 & 压缩 css
|
|
|
@@ -141,7 +69,7 @@ gulp.task('css', () => {
|
|
|
let contents = file.contents.toString('utf-8');
|
|
|
|
|
|
let merge = (fp, fc) => {
|
|
|
- return fc.replace(/\@import\s+(url\()?\s*(['"])([^'"]*)\2\s*(\))?\s*;?/gm, function (frag, $1, $2, mod) {
|
|
|
+ return fc.replace(/\@import\s+(url\()?\s*(['"])(.*)\2\s*(\))?\s*;?/gm, function (frag, $1, $2, mod) {
|
|
|
let mp = path.resolve(fp, '../' + mod + (/\.css$/.test(mod) ? '' : '.css'));
|
|
|
let mc = fs.readFileSync(mp).toString('utf-8');
|
|
|
return merge(mp, mc);
|
|
|
@@ -149,119 +77,120 @@ gulp.task('css', () => {
|
|
|
};
|
|
|
|
|
|
contents = merge(file.path, contents);
|
|
|
- file.contents = new Buffer.from(contents);
|
|
|
+ file.contents = new Buffer(contents);
|
|
|
this.push(file);
|
|
|
return cb();
|
|
|
})
|
|
|
};
|
|
|
|
|
|
- return gulp.src(`fehelper${singleTool}/**/*.css`).pipe(cssMerge()).pipe(uglifycss()).pipe(gulp.dest(`output/fehelper${singleTool}`));
|
|
|
+ return gulp.src('apps/**/*.css').pipe(cssMerge()).pipe(uglifycss()).pipe(gulp.dest('output/apps'));
|
|
|
});
|
|
|
|
|
|
-// 给静态文件增加md5戳
|
|
|
-gulp.task('md5', () => {
|
|
|
-
|
|
|
- let md5Replace = () => {
|
|
|
- return through.obj(function (file, enc, cb) {
|
|
|
- let contents = file.contents.toString('utf-8');
|
|
|
+// 清理冗余文件,并且打包成zip,发布到chrome webstore
|
|
|
+gulp.task('zip', () => {
|
|
|
+
|
|
|
+ // 读取manifest文件
|
|
|
+ let pathOfMF = './output/apps/manifest.json';
|
|
|
+ let manifest = require(pathOfMF);
|
|
|
+
|
|
|
+ // background、content-script中的文件,可以作为例外
|
|
|
+ let excludes = manifest.background.scripts.concat(manifest.content_scripts.map(cs => {
|
|
|
+ return cs.js.join(',');
|
|
|
+ }).join(',').split(','));
|
|
|
+
|
|
|
+ // ============冗余文件清理================================================
|
|
|
+ shell.cd('output/apps');
|
|
|
+ let fileList = shell.find('./').filter(file => {
|
|
|
+ let included = 'yes';
|
|
|
+ if (file.match(/\.css$/) && !/index\.css$/.test(file)) {
|
|
|
+ included = shell.grep('-l', file, './**/*.{css,html,js}').stdout;
|
|
|
+ } else if (file.match(/\.js$/) && !/index\.js$/.test(file)) {
|
|
|
+ included = shell.grep('-l', file.replace(/\.js$/, ''), './**/*.{html,js}').stdout;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果没有搜索到,再尝试下在js、css文件的当前目录下搜寻
|
|
|
+ if (!included.trim().length && /\.(js|css)$/.test(file)) {
|
|
|
+ let arr = file.split(/\//);
|
|
|
+ let filename = arr.splice(-1);
|
|
|
+ let dirname = arr.join('/');
|
|
|
+
|
|
|
+ included = shell.grep('-l', filename, (dirname || '.') + '/*.{html,js,css}').stdout;
|
|
|
+ }
|
|
|
+
|
|
|
+ return !included.trim().length;
|
|
|
+ });
|
|
|
+ fileList = fileList.filter(f => excludes.indexOf(f) === -1);
|
|
|
+ fileList.forEach(f => {
|
|
|
+ shell.rm('-rf', f);
|
|
|
+ console.log(new Date().toLocaleString(), '> 清理掉冗余文件:', f);
|
|
|
+ });
|
|
|
+ shell.cd('../../');
|
|
|
|
|
|
- let replace = (fp, fc) => {
|
|
|
- [
|
|
|
- [
|
|
|
- /<script[^>]*>\s*?<\/[^>]*script>/gim,
|
|
|
- /src=['"]([^'"]+)['"]/igm,
|
|
|
- 'src'
|
|
|
- ],
|
|
|
- [
|
|
|
- /<link\s+[^>]*stylesheet[^>]*>/gim,
|
|
|
- /href=['"]([^'"]+)['"]/igm,
|
|
|
- 'href'
|
|
|
- ]
|
|
|
- ].forEach(item => {
|
|
|
- fc = fc.replace(item[0], frag => {
|
|
|
- return frag.replace(item[1], function ($1, $2) {
|
|
|
- if(/^http(s)?:\/\//.test($2)) {
|
|
|
- return $2;
|
|
|
- }
|
|
|
-
|
|
|
- if ($2.indexOf('?') !== -1) {
|
|
|
- let x = $2.split('?');
|
|
|
- x.pop();
|
|
|
- $2 = x.join('');
|
|
|
- }
|
|
|
- let mp = path.resolve(fp, '../' + $2);
|
|
|
- let mc = fs.readFileSync(mp).toString('utf-8');
|
|
|
- let md5 = crypto.createHash('md5').update(mc).digest('hex');
|
|
|
- return `${item[2]}="${$2}?v=${md5.slice(-8)}"`;
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- return fc;
|
|
|
- };
|
|
|
+ // web_accessible_resources 中也不需要加载这些冗余的文件了
|
|
|
+ manifest.web_accessible_resources = manifest.web_accessible_resources.filter(f => fileList.indexOf(f) === -1);
|
|
|
+ manifest.name = manifest.name.replace('-Dev', '');
|
|
|
+ fs.writeFileSync(pathOfMF, JSON.stringify(manifest));
|
|
|
|
|
|
- contents = replace(file.path, contents);
|
|
|
- file.contents = new Buffer.from(contents);
|
|
|
- this.push(file);
|
|
|
- return cb();
|
|
|
- })
|
|
|
- };
|
|
|
+ // ============压缩打包================================================
|
|
|
+ shell.exec('cd output/ && rm -rf fehelper.zip && zip -r fehelper.zip apps/ > /dev/null && cd ../');
|
|
|
+ let size = fs.statSync('output/fehelper.zip').size;
|
|
|
+ size = pretty(size);
|
|
|
|
|
|
- return gulp.src(`output/fehelper${singleTool}/**/*.html`).pipe(md5Replace()).pipe(gulp.dest(`output/fehelper${singleTool}`));
|
|
|
-});
|
|
|
|
|
|
-// 清理冗余文件,并且打包成zip
|
|
|
-gulp.task('zip', ['md5'], () => {
|
|
|
- // hello-world是一个demo,代码不能被压缩
|
|
|
- shell.exec('cp -r hello-world output/fehelper/');
|
|
|
- shell.exec('cd output/ && rm -rf fehelper.zip && zip -r fehelper.zip fehelper/* > /dev/null && cd ../ && rm -rf fehelper/');
|
|
|
+ console.log('\n\n================================================================================');
|
|
|
+ console.log(' 当前版本:', manifest.version, '\t文件大小:', size);
|
|
|
+ console.log(' 去Chrome商店发布吧:https://chrome.google.com/webstore/devconsole');
|
|
|
+ console.log('================================================================================\n\n');
|
|
|
|
|
|
- console.log('\n\tfehelper.zip 已打包完成!可以提交代码去更新网站了!\n');
|
|
|
});
|
|
|
|
|
|
-// 创建fehelper目录
|
|
|
-gulp.task('fehelper', () => {
|
|
|
- let excludeFiles = ['fehelper', 'gulpfile.js', 'LICENSE', 'package.json', 'package-lock.json', 'README.md', 'output', 'node_modules'];
|
|
|
- let tools = shell.ls().filter(file => !/^\./.test(file) && !excludeFiles.includes(file));
|
|
|
- shell.exec('rm -rf fehelper && mkdir fehelper && cp -r ' + tools.join(' ') + ' fehelper/');
|
|
|
-});
|
|
|
+// 打包Firefox安装包
|
|
|
+gulp.task('firefox', () => {
|
|
|
+ shell.exec('rm -rf output-firefox && cp -r output output-firefox && rm -rf output-firefox/fehelper.zip');
|
|
|
+
|
|
|
+ // 清理掉firefox里不支持的tools
|
|
|
+ let rmTools = ['page-capture', 'color-picker', 'ajax-debugger', 'wpo', 'code-standards', 'ruler', 'remove-bg'];
|
|
|
+ shell.cd('output-firefox/apps');
|
|
|
+ shell.find('./').forEach(f => {
|
|
|
+ if (rmTools.includes(f)) {
|
|
|
+ shell.rm('-rf', f);
|
|
|
+ console.log('已删除不支持的工具:', f);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ shell.cd('../../');
|
|
|
+
|
|
|
+ // 更新firefox所需的配置文件
|
|
|
+ let pathOfMF = './output-firefox/apps/manifest.json';
|
|
|
+ let manifest = require(pathOfMF);
|
|
|
+ manifest.description = 'FE助手:JSON工具、代码美化、代码压缩、二维码工具、网页定制工具、便签笔记,等等';
|
|
|
+ delete manifest.update_url;
|
|
|
+ manifest.applications = {
|
|
|
+ "gecko": {
|
|
|
+ "id": "[email protected]",
|
|
|
+ "strict_min_version": "57.0"
|
|
|
+ }
|
|
|
+ };
|
|
|
+ manifest.version = manifest.version.replace(/\./, '') + 'stable';
|
|
|
+ manifest.content_scripts.splice(1,2);
|
|
|
+ fs.writeFileSync(pathOfMF, JSON.stringify(manifest));
|
|
|
|
|
|
-// builder
|
|
|
-gulp.task('default', ['clean'], () => {
|
|
|
- if (require('os').hostname() === 'www-baidufe-com') {
|
|
|
- return console.log('当心,别乱来!不允许在服务器上直接编译!');
|
|
|
- }
|
|
|
+ shell.exec('cd output-firefox/apps && zip -r ../fehelper.xpi ./ > /dev/null && cd ../../');
|
|
|
+ let size = fs.statSync('output-firefox/fehelper.xpi').size;
|
|
|
+ size = pretty(size);
|
|
|
|
|
|
- let args = process.argv.slice(2);
|
|
|
- if (args.length === 2 && args[0] === '--t') {
|
|
|
- singleTool = `/${args[1]}`;
|
|
|
- }
|
|
|
+ console.log('\n\nfehelper.xpi 已打包完成!');
|
|
|
|
|
|
- runSequence(['fehelper', 'copy', 'css', 'js', 'html', 'json'], 'zip');
|
|
|
+ console.log('\n\n================================================================================');
|
|
|
+ console.log(' 当前版本:', manifest.version, '\t文件大小:', size);
|
|
|
+ console.log(' 去Chrome商店发布吧:https://addons.mozilla.org/zh-CN/developers/addon/web%E5%89%8D%E7%AB%AF%E5%8A%A9%E6%89%8B-fehelper/versions');
|
|
|
+ console.log('================================================================================\n\n');
|
|
|
});
|
|
|
|
|
|
-
|
|
|
-// 在服务器上进行发布
|
|
|
-gulp.task('deploy', () => {
|
|
|
- shell.exec('cd output/ && rm -rf fehelper.bak && mv fehelper fehelper.bak && unzip fehelper.zip > /dev/null');
|
|
|
- console.log('已发布成功!');
|
|
|
+// builder
|
|
|
+gulp.task('default', ['clean'], () => {
|
|
|
+ runSequence(['copy', 'css', 'js', 'html', 'json'], 'zip');
|
|
|
});
|
|
|
|
|
|
gulp.task('sync', () => {
|
|
|
- gulp.src('fehelper/**/*').pipe(gulp.dest('output/fehelper'));
|
|
|
-});
|
|
|
-
|
|
|
-// 开发过程中用,watch while file changed
|
|
|
-gulp.task('watch', () => {
|
|
|
- gulp.watch('fehelper/**/*.*', (event) => {
|
|
|
- let wp = watchPath(event, './', './output');
|
|
|
- gulp.src(wp.srcPath).pipe(copy('output')).pipe(gcallback(() => {
|
|
|
- console.log(new Date().toLocaleString(), '> 文件发生变化,已编译:', wp.srcPath);
|
|
|
- }));
|
|
|
- });
|
|
|
-});
|
|
|
-
|
|
|
-// 用esbuild来进行js文件压缩,超级快。。。。。
|
|
|
-gulp.task('esbuild',() => {
|
|
|
- shell.cd('output');
|
|
|
- shell.exec(`find . -type f -name "*.js" -exec esbuild --minify {} --outfile=dist/{} \\;`);
|
|
|
+ gulp.src('apps/**/*').pipe(gulp.dest('output/apps'));
|
|
|
});
|