最近一段时间一直在做桌面混合应用,跟以往做web端不同的是,无法再通过在浏览器上输入内部的域名来随时跟踪开发版本的状况了,只能通过打包代码让产品或领导随时跟踪进度。
这里就涉及到一些问题了:
1,需要打包成zip文件便于传输
2,需要排除一些仅是开发中需要的文件,如node_modules,一些不必要的config等
然后,首当其冲gulp,关于gulp和grunt的比较,流式(stream)操作比较快之类的云云就不多废话了。
一,生成zip文件
使用gulp-zip插件
首先是安装
npm install gulp -g
npm install gulp gulp-zip --save-dev
这里存在两个问题:
为什么要装两次gulp,一次全局一次本地?全局安装是为了随时随地可以在命令行中使用gulp,命令行并不认识local安装的gulp命令,本地安装是为了维护你当前的项目所依赖的gulp版本,且本地运行更快,当然如果你实在不爽两地安装或者到发布环境再去全局安装gulp显得很多余,你当然可以这样做,在项目根目录下的package.json中这样写:
{
...//此处省略100行
"main": "src/js/index.js",
"scripts": {
"zip": "gulp zip"
},
...//此处省略100行
}
如此就可以不用全局安装gulp了,因为npm-script会自动到local的node_modules目录中查找到gulp命令。
为什么使用--save-dev而不用--save?是因为该插件仅为开发所依赖,不为使用所依赖,说白了就是只有开发者才需要用这个插件,使用者是不需要的,所以使用--save-dev。
安装完了之后,就开始编写gulpfile.js(如果要使用es6语法,需改名为gulpfile.babel.js,并需安装babel,题外话,不展开):
const gulp = require('gulp');
const zip = require('gulp-zip');
gulp.task('zip', function() {
return gulp.src('**/*.*')
.pipe(zip('test.zip'))
.pipe(gulp.dest('export'));
});
gulp的使用问题不在这里赘述。然后就可以在根目录下运行
gulp zip
或使用npm-script方式
npm run zip
然后就在export/下能看到你导出的test.zip文件,里面包含了根目录下的所有文件。
二,排除某些不需要的目录和文件
一些常见的需要排除的目录有node_modules,本地config等,gulp.src提供了强大的路径匹配,我们都知道src能接受数组来做多个匹配。
一开始你可能会这样写:
gulp.src(['!**/node_modules/**/*.*','!config/**/*.*'])
然后就出错了:Error: Missing positive glob
原来反匹配在gulp.src中是不可以写在第一位的,第一项一定是正匹配,于是这样写:
gulp.src(['**/*.*','!**/node_modules/**/*.*','!config/**/*.*'])
一切大吉了,压缩出来的文件不包含这些文件夹里的东西了。也许你要问,就排除个文件夹,为什么不能直接写**/node_modules?据我实验下来,这边过滤的只能是文件而不是一个路径,如果你只写路径,是没有效果的,必须匹配到该路径下的所有文件。
运维网声明
1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网 享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com