保存到桌面加入收藏设为首页
java开发
当前位置:首页 > java开发

前端资源多个产品整站一键打包&包版本管理(二)如何在bower的配置文件加上注释-安度博客

时间:2019-02-08 15:40:02   作者:   来源:   阅读:86   评论:0
内容摘要:问题:当一个工程内里有好几个项目,每个项目引用同一个包,可是差异的名字,例如在bower中 fancybox 跟 jquery.fancybox 是一样的,我们只需要下载其中的一个版本,而打包事情不是同一小我私家写的,因此要写如注释,可是bower的配置文件内里不许有注释,那怎么......
  • 问题:

    当一个工程内里有好几个项目,每个项目引用同一个包,可是差异的名字,例如在bower中 fancybox 跟 jquery.fancybox 是一样的,我们只需要下载其中的一个版本,而打包事情不是同一小我私家写的,因此要写如注释,可是bower的配置文件内里不许有注释,那怎么办呢?

    解决要领:

    使用gulp来生成bower.json 文件

    首先我们在Gulpfile.js 文件中

    'use strict';let gulp = require('gulp');let modify = require('gulp-modify');let rename = require('gulp-rename');let strip = require('gulp-strip-comments');let pump = require('pump');gulp.task('bower' (cb) => { pump([ gulp.src('./bower.comment.json') //使用的文件 strip() rename('bower.json') //重命名 gulp.dest('./') //输出的文件 ] cb);});

    首先说一下pump的用法,当我们不使用pump的时候,如果中途堕落了,那之前执行的会在,可是使用pump之后,如果中途堕落了,之前执行的都不会在。

    其次是 gulp-strip-comments 的用法

    可以参照 npm中的文档 是用于去除文件中的注释

    接下来我们在 bower.comment.json 内里配置我们的包 可以写上注释

    { 'name': 'main' 'version': '1.0.0' 'homepage': '' 'private': true 'ignore': [ '**/.*' 'node_modules' 'bower_components' 'public/bower_components' 'test' 'tests' ] 'dependencies': { // 'bootstrap-markdown':'~2.0.0' 'components-font-awesome': '4.6.0' 'jquery.atwho': '1.5.1' 'font-awesome': '4.6.3' 'highlight': '9.5.0' 'pickadate': '3.5.6' 'echarts': '3.2.1' 'jquery': '2.2.4' 'jquery-ui': '1.12.0' 'angular-route':'1.4.6' 'clipboard':'1.5.2' 'd3':'3.5.5' 'fullcalendar':'2.9.0' 'markdown':'0.5.0' 'datepicker':'' // 'bootstrap-datetimepicker':'~0.0.11' /*jquery plugins ---------begin*/ 'datetimepicker': '2.5.4' //jquery.datetimepicker.js 'fancybox': '2.1.5' //jquery.fancybox.js 'jquery-form': '3.46.0' //jquery.form.js 'jquery.hotkeys': '' //jquery.hotkeys.js 'jquery-mousewheel': '3.1.13' //jquery.mousewheel.js 'raty': '2.7.0' //jquery.raty.js 'tooltipster': '4.0.4' //jquery.tooltipster 'jquery-typeahead': '2.6.1' //jquery.typeahead /*jquery plugins ---------end*/ 'dropzone': '4.3.0' 'simditor': '2.3.6' 'slick-carousel': '1.6.0' 'ionicons': '2.0.1' 'vivus': '0.3.1' 'vue': '1.0.26' 'underscore':'1.7.0' 'jquery-extends':'0.1.9' 'jquery.validate':'1.13.0' 'jquery.scrollTo':'1.4.13'// 'file-upload':'1.7.5' 'd3pie':'0.1.3' 'bootstrap-datepicker':'1.6.1' 'bootstrap-datetimepicker':'0.0.11' } 'resolutions': { 'jquery': '2.2.4' 'angular':'1.4.6' 'bootstrap': '3.3.6' }}

    接下来输入

    gulp bower

    就可以看到目录下生成一个bower.json 了、内里就是没有注释的bower配置文件

    打开

    { 'name': 'main' 'version': '1.0.0' 'homepage': '' 'private': true 'ignore': [ '**/.*' 'node_modules' 'bower_components' 'public/bower_components' 'test' 'tests' ] 'dependencies': { 'components-font-awesome': '4.6.0' 'jquery.atwho': '1.5.1' 'font-awesome': '4.6.3' 'highlight': '9.5.0' 'pickadate': '3.5.6' 'echarts': '3.2.1' 'jquery': '2.2.4' 'jquery-ui': '1.12.0' 'angular-route':'1.4.6' 'clipboard':'1.5.2' 'd3':'3.5.5' 'fullcalendar':'2.9.0' 'markdown':'0.5.0' 'datepicker':'' 'datetimepicker': '2.5.4' 'fancybox': '2.1.5' 'jquery-form': '3.46.0' 'jquery.hotkeys': '' 'jquery-mousewheel': '3.1.13' 'raty': '2.7.0' 'tooltipster': '4.0.4' 'jquery-typeahead': '2.6.1' 'dropzone': '4.3.0' 'simditor': '2.3.6' 'slick-carousel': '1.6.0' 'ionicons': '2.0.1' 'vivus': '0.3.1' 'vue': '1.0.26' 'underscore':'1.7.0' 'jquery-extends':'0.1.9' 'jquery.validate':'1.13.0' 'jquery.scrollTo':'1.4.13' 'd3pie':'0.1.3' 'bootstrap-datepicker':'1.6.1' 'bootstrap-datetimepicker':'0.0.11' } 'resolutions': { 'jquery': '2.2.4' 'angular':'1.4.6' 'bootstrap': '3.3.6' }}

    我们开发的时候就在bower.comment.json内里写我们的包引入 这样做的利益就是:开发的时候我们可能由差异的人来开发,提高代码的可阅性


最近更新

精彩推荐

阅读排行

本站所有站内信息仅供娱乐参考,不作任何商业用途,不以营利为目的,专注分享快乐,欢迎收藏本站!
所有信息均来自:百度一下 (威尼斯人官网)