一块儿来构建前端工具链吧~（开发项目）

       继续上篇介绍的 nuts 的内容，在咱们经过 create 命令以后，就可使用 dev 命令去进行项目的开发了~那么这个 dev 命令究竟都执行了哪些功能呢？

      首先，咱们须要将咱们的源代码进行预编译不管是从ES6到ES5，仍是从scss到css，咱们最终的目标代码都是和源代码不同的，那么咱们在启动项目以后就须要将这些目标代码和源代码分开来，因此在 dev 命令之中咱们主要作的就是两件事，一个是预编译咱们的代码到正确的路径上，另外一个就是对开发环境正确性的检查，其实对于预编译的部分咱们并无作什么特别的处理，都是基本的转换和编译，更多的代码都是在检测目录是否存在或者静态服务器是否正常启动之类的逻辑处理，对于源代码的处理上，我这里就仅仅只举一个小栗子来讲明一下大体的逻辑，其余的文件基本都是如此处理了。

/**
 * 对项目中的scss文件进行编译
 * @param input
 * @param output
 */
function compassSass(input, output) {
    controller.packages._core.src(input)
        .pipe(controller.packages._plumber())
        .pipe(controller.packages._compass({
            includePaths: controller.config.sassLib
        }))
        .pipe(controller.packages._connect.reload())
        .pipe(controller.packages._core.dest(output));
}

       咱们经过一个个这样的命令，经过传入输入输出目录来将代码进行预编译，并经过第三方或者本身的配置去作特殊的处理，例如上面代码中的compass任务，引入的就是我本身的scss库，原本以前是使用 compass 的，可是在代码迁移到全node的环境后，为了去除ruby的依赖，compass一样也面临着被替换，所以本身根据平日的需求写了一个运行在node上的scss库，这样就能够再也不安装ruby了。接下来演示的就是关于静态服务器的部分了，在这里我采用的是 gulp-connect，本来打算本身写一个的，可是发如今处理自动刷新的时候只能经过node的watch方法进行文件变更的监控，感受效率上太差了，因此暂时放弃，就使用了更加优秀的库来代替，固然了，之后有时间我会再尝试尝试的~反正如今这个结构替换起来仍是至关容易的~

      在这个任务中，首先先检查命令行中传入的端口号和项目路径是否合法，路径好说，那么端口又如何检测合法性呢？我在这里的思路是经过node中的net模块去先启动这个端口号，经过监听的结果来判断当前端口是否被占用，若是占用就返回false，若是没有被占用，那么就先关闭本身，释放端口后返回true，这样在回调函数中就能够判断是否能够启动服务器，同时，在这里我还作了两个功能点，一个是在命令行中打印出当前本机的IP地址和端口号，这样咱们就能够方便的复制连接到浏览器中打开页面。那么如何取得当前本机的IP地址呢？

       在 util 目录下的get_ip_address文件中，咱们 os 模块中的网络接口来拿到整个网络对象，而后循环遍历出IPv4对象下的地址，感兴趣的同窗能够看看这个模块下返回的内容~

 

 

      随后在获得IP地址后拼接出完整的 http 请求后我又在想，若是我须要在移动端上打开页面该怎么办呢？难道要在手机上输入这么长的连接？若是能在手机上一键打开就行了，能够如今我总不能本身再写一个程序安装在手机上吧。。。后来想到如今的手机都有了扫描二维码的功能，若是我在命令行上显示连接的二维码，那我拿手机扫描一下不就行了嘛~因而我搜索了一遍 npm，找到了这个库 qrcode-terminal，它能够接收一段字符串，并经过二维码的形式显示在命令行上，效果以下所示：

      这样之后在手机上开发页面的时候就能够扫一扫啦~固然如今还有一个功能还在构想中，若是在我执行命令的时候能自动启动浏览器就行了，接下来再完善这里的功能吧~

 

 

 

 

 

 

       最后在开发完成项目以后提交代码前咱们须要将开发过程当中的过程文件都删除掉咯，接下来咱们只须要执行 clean 命令就可让nuts去自动删除咱们产生的垃圾文件了，而且在clean任务中我会过滤掉中文名称的文件，毕竟咱们的路径最好仍是使用英文比较合适啦，中文文件名总显得那么不三不四的。那剩下还有两个命令 include 和 build，build 命令很好理解，是最终上线时进行编译的命令，在这个命令中咱们须要作版本管理和CDN路径的处理了，那 include 命令呢？在下一篇中我会介绍如何使用node来生成文件去控制静态资源的引入~(￣︶￣)↗