Vue和Vux开发WebApp日志继续完善gulp任务,增加命令行参数

Posted 静茹♂鱼

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue和Vux开发WebApp日志继续完善gulp任务,增加命令行参数相关的知识,希望对你有一定的参考价值。

转载请注明出处:http://www.cnblogs.com/shamoyuu/p/vue_vux_4.html

 

项目github地址:https://github.com/shamoyuu/vue-vux-iconan

上一章我们基本上完成了开发、打包的任务,但是还有很多问题,这一章我们来增加命令行参数,来使gulp更加灵活。

首先我们来获取命令行参数。

获取命令行参数需要用到minimist插件,来将process.argv数组转化成一个对象

const minimist = require(\'minimist\');
//命令行参数配置
const argsOptions = {
    string: [\'e\', \'p\', \'t\'],
    default: {
        e: \'production\', //环境,可选值有【test】【production】
        p: \'android\', //平台,只在t为mobile时有效,可选值有【android】
        t: \'webapp\' //目标,可选参数有【mobile】【webapp】
    }
};

const args = minimist(process.argv.slice(2), argsOptions);

这样我们的配置文件和命令行参数都获取到了,我们来继续完善任务。

 

然后我们添加一个任务

\'build\': () => {
    if(args.t == \'mobile\'){
        runSequence(
            \'build.android\'
        );
    }
    else if(args.t == \'webapp\'){
        runSequence(
            \'build.webapp\'
        );
    }
    else {

          console.info(chalk.red(\'Target【\' + args.t + \'】不存在\'));
          process.exit(1);

    }
}

 

这样就可以用gulp build -t mobile和gulp build -t webapp来分辨打包,因为我们的t默认值是webapp,所以第二条也可以简写为gulp build。

 

完结,散花。 

以上是关于Vue和Vux开发WebApp日志继续完善gulp任务,增加命令行参数的主要内容,如果未能解决你的问题,请参考以下文章

vue项目中安装使用vux

使用vue-cli构建多页面应用+vux

VUE vux深入浅出

vux-scroller实现移动端上拉加载功能

VUX学习总结.md

Gulp和Webpack对比