Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
wck - npm Package Compare versions
Comparing version 0.0.2 to 0.0.3
188
bin/wck.js
| #!/usr/bin/env node | ||
| var path = require('path'); | ||
| var readfile = require('../lib/readfile'); | ||
| var writefile = require('../lib/writefile.js'); | ||
| var log = require('../lib/log'); | ||
| var run = require('../lib/shrink.js'); | ||
| command = {}; | ||
| var command = {}; | ||
| var comindex = {}; | ||
| //链接抽取 | ||
| var regHTML = /<link\s+rel="import"\s+href="(.*)".*[\n\r]/ig; | ||
| var regCSS = /<link\s+rel="stylesheet"\s+href="(.*)".*[\n\r]/ig; | ||
| var regJS = /<script.*src="(.*)".*[\n\r]/ig; | ||
| command.help = function() { | ||
| log.info([ | ||
| "How to use ?", | ||
| " wpt [target] -d [dest]", | ||
| " wpt [target] -d [dest] --nomin", | ||
| "", | ||
| "Example:", | ||
| " wpt a.html b.html -d dist", | ||
| " wpt a.html b.html -d build", | ||
| "" | ||
@@ -32,4 +23,19 @@ ].join('\n')); | ||
| command.build = function(args) { | ||
| var files = Array.prototype.slice.call(args, 2); | ||
| begin(files); | ||
| var arg = Array.prototype.slice.call(args,2); | ||
| var argstr = Array.prototype.join.call(arg, " "); | ||
| var minify = 'y'; | ||
| var dist = 'build'; | ||
| argstr = argstr.replace(/-d\s*(\S*)/, function() { | ||
| dist = arguments[1] || dist; | ||
| return ''; | ||
| }); | ||
| argstr = argstr.replace(/-minify\s*(\S*)/, function() { | ||
| minify = arguments[1] || minify; | ||
| return ''; | ||
| }); | ||
| var files = argstr.trim().split(' '); | ||
| run(files, { | ||
| dist: dist, | ||
| minify: minify === 'y' ? true : false | ||
| }); | ||
| } | ||
@@ -42,153 +48,1 @@ | ||
| } | ||
| /* | ||
| * 工作过程： | ||
| * 1 分析目标页面获取 组件地址 | ||
| * 2 遍历结果，将内部依赖扁平化 | ||
| * 3 将html合并成一个文件，将css合并成一个文件 | ||
| * 4 将目标页转换成最终结果页 | ||
| */ | ||
| function begin(files) { | ||
| var cop = 'components/foxui.html'; | ||
| for (var i = 0, len = files.length; i < len; i++) { | ||
| var basename = path.basename(files[i], '.html'); | ||
| var s = basename + '/style.css'; | ||
| var j = basename + '/action.js'; | ||
| var css = 'build/' + s; | ||
| var js = 'build/' + j; | ||
| var page = 'build/' + basename + '.html'; | ||
| var result = shinkWP(files[i], | ||
| false, | ||
| '<link rel="import" href="' + cop + '"/>', | ||
| '<link rel="stylesheet" href="' + s + '"/>', | ||
| '<script src="' + j + '"></script>' | ||
| ); //抽取页面中含有 web component; | ||
| writefile(css, result.css, 'css'); | ||
| writefile(js, result.js, 'js'); | ||
| writefile(page, result.page, 'html'); | ||
| } | ||
| var allcomponents = Object.keys(comindex).map(function(key){ | ||
| return comindex[key]; | ||
| }).join(' '); | ||
| writefile('build/'+cop,allcomponents,'html') | ||
| } | ||
| function shinkCSS(folder, buf) { | ||
| var dist = []; | ||
| var css = []; | ||
| buf = buf.replace(regCSS, function() { | ||
| css.push(arguments[1]); | ||
| return ''; | ||
| }); | ||
| for (var i = 0, len = css.length; i < len; i++) { | ||
| var str = readfile(path.join(folder, css[i]), 'utf8'); | ||
| dist.push(str); | ||
| } | ||
| return { | ||
| css: dist.join(''), | ||
| html: buf | ||
| } | ||
| } | ||
| function shinkJS(folder, buf) { | ||
| var dist = []; | ||
| var js = []; | ||
| buf = buf.replace(regJS, function() { | ||
| js.push(arguments[1]); | ||
| return ''; | ||
| }); | ||
| for (var i = 0, len = js.length; i < len; i++) { | ||
| var str = readfile(path.join(folder, js[i]), 'utf8'); | ||
| dist.push(str); | ||
| } | ||
| return { | ||
| js: dist.join(''), | ||
| html: buf | ||
| } | ||
| } | ||
| /* | ||
| * shinkWP | ||
| * @aim 目标文件 [String] | ||
| * @description: | ||
| * 获得目标文件中蕴含的web component 组件 | ||
| * 有两个应用场景： | ||
| * 1 分析目标页面 | ||
| * 2 扁平化组件依赖 | ||
| */ | ||
| function shinkWP(aim, ischild, link, csslink, jslink) { | ||
| var dist = { | ||
| js: [], | ||
| css: [], | ||
| html: [] | ||
| }; | ||
| link = link || ''; | ||
| csslink = csslink || ''; | ||
| jslink = jslink || ''; | ||
| var components = []; | ||
| var buf = readfile(aim, 'utf8'); | ||
| var newlinkadded = false; | ||
| var pc = shinkCSS(path.dirname(aim),buf); | ||
| dist.css.push(pc.css); | ||
| buf = pc.html; | ||
| var pj = shinkJS(path.dirname(aim),buf); | ||
| dist.js.push(pj.js); | ||
| buf = pj.html; | ||
| dist.page = buf.replace(regHTML, function() { | ||
| //抽取component | ||
| components.push(arguments[1]); | ||
| if (ischild) { | ||
| return ''; | ||
| } | ||
| if (newlinkadded) { | ||
| return ''; | ||
| } else { | ||
| newlinkadded = true; | ||
| return csslink + '\n' + jslink + '\n' + link; | ||
| } | ||
| }); | ||
| for (var i = 0, len = components.length; i < len; i++) { | ||
| var f = path.join(path.dirname(aim), components[i]); | ||
| var key = path.basename(components[i],'.html'); | ||
| if (comindex[key]) { | ||
| continue; | ||
| } | ||
| var html = readfile(f, 'utf8'); | ||
| var tmp = shinkCSS(path.dirname(components[i]), html); | ||
| var css = tmp.css; | ||
| html = tmp.html; | ||
| tmp = shinkJS(path.dirname(components[i]), html); | ||
| var js = tmp.js | ||
| html = tmp.html | ||
| var hasSubComponent = regHTML.test(html); | ||
| //递归解决web coponent中的依赖 | ||
| if (hasSubComponent) { | ||
| var res = shinkWP(components[i], true); | ||
| dist.html.push(res.html); | ||
| dist.css.push(res.css); | ||
| dist.js.push(res.js); | ||
| //comindex[key] = res.html; | ||
| } else { | ||
| dist.html.push(html); | ||
| comindex[key] = html; | ||
| } | ||
| dist.css.push(css); | ||
| dist.js.push(js); | ||
| } | ||
| dist.css = dist.css.join('\n'); | ||
| dist.js = dist.js.join('\n'); | ||
| dist.html = dist.html.join('\n'); | ||
| return dist; | ||
| } |
@@ -8,3 +8,5 @@ var fs = require('fs'); | ||
| var html = require('html-minifier'); | ||
| var css = new require('clean-css')({keepSpecialComments:0}); | ||
| var css = new require('clean-css')({ | ||
| keepSpecialComments: 0 | ||
| }); | ||
| var js = require("uglify-js"); | ||
@@ -21,23 +23,26 @@ | ||
| exports = module.exports = function(dist, buffer, type) { | ||
| exports = module.exports = function(dist, buffer, type, minify) { | ||
| nfs.mkdir(path.dirname(dist), 0777, true, function(err) { | ||
| if (err) log.error(err); | ||
| else { | ||
| switch (type) { | ||
| case 'js': | ||
| buffer = js.minify(buffer, { | ||
| fromString: true | ||
| }).code; | ||
| break; | ||
| case 'css': | ||
| buffer = css.minify(buffer); | ||
| break; | ||
| case 'html': | ||
| buffer = html.minify(buffer, htmlconfig); | ||
| break; | ||
| default: | ||
| break; | ||
| if (minify) { | ||
| switch (type) { | ||
| case 'js': | ||
| buffer = js.minify(buffer, { | ||
| fromString: true | ||
| }).code; | ||
| break; | ||
| case 'css': | ||
| buffer = css.minify(buffer); | ||
| break; | ||
| case 'html': | ||
| buffer = html.minify(buffer, htmlconfig); | ||
| break; | ||
| default: | ||
| break; | ||
| } | ||
| log.info("minify %s", dist); | ||
| }else{ | ||
| log.info("generated %s", dist); | ||
| } | ||
| log.info("minify %s",dist); | ||
| fs.writeFile(dist, buffer, 'utf8'); | ||
@@ -44,0 +49,0 @@ } |
| { | ||
| "name": "wck", | ||
| "version": "0.0.2", | ||
| "version": "0.0.3", | ||
| "description": "web components pre-build tools", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by3.09%
26683
- Number of package files
- increased by10%
11
- Lines of code
- increased by9.17%
262
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes