zoukankan      html  css  js  c++  java
  • 【Grunt】关于Grunt可视化的尝试

    使用Grunt遇到的问题?

    • 必须要安装NodeJS
    • 必须安装grunt-cli
    • 需要编写复杂的Gruntfile.js规则
    • 每个项目中必须存在nodejs的grunt模块
    • 不方便管理每一个包含grunt的项目
    • 无法快速开始一个项目

    解决思路

    • 直接把NodeJSgrunt-cli包含进去?
    • 弄个有UI的界面来管理?
    • 用程序简化gruntfile的规则?
    • 将所有项目中需要的grunt模块包含到一起?
    • 默认内置一些常用功能模块?

    解决方案 -- nodewebkit

    • 集成了nodejs,省去NodeJS安装
    • 集成webkit内核,方便编写界面
    • 适合前端人员开发
    • 一次开发,兼容三大平台window/mac/linux

    遇到问题

    一.如何让NodeJS运行Grunt?

    1. 利用NodeJS的spawn运行cmd命令

      //切换运行环境到项目中
      process.chdir("项目地址");
      //执行grunt
      require("child_process").spawn("grunt");

      这种方案最简单,但需要依赖NodeJSgrunt-cli

    2. 将grunt-cli的模块直接引进代码中,利用nodejs调用

      var gruntpath = "grunt.js的路径";
      var grunt = require(gruntpath);
      grunt.cli();

      直接运行,提示找不到gruntfile.js,修改grunt文件夹中的task.js,大概在430行左右

      var old_path = process.cwd();//获取当前工作目录
      process.chdir('项目文件目录');//修改到项目目录
      var gruntfile = allInit ? null : grunt.option('gruntfile') ||
      grunt.file.findup('Gruntfile.{js,coffee}', {nocase: true});//查找gruntfile文件
      process.chdir(old_path);//修改回程序目录
      此处省略n行代码~~~
      (grunt.option('npm') || []).forEach(task.loadNpmTasks);//加载npm的模块
      process.chdir('项目文件目录');//切换到项目目录

      先切换到项目文件目录查找gruntfile.js文件,然后切换回程序目录查找node模块,运行完grunt后,程序自动退出了,囧,需要修改grunt下的exit.js

      process.exit(0);//这句需要注释掉

    二.如何在子进程中运行Grunt?

    1. 利用NodeJS的child_process.fork

      var child = require("child_process").fork("child.js");
      child.onmessage = function(data){
        console.log(data);
      }
      child.on("exit",function(exitCode){
        console.log(exitCode);
      });

      --运行后提示:unzip the package xx/child.js,上网各种谷歌之后得出作者结论:

      child_process.fork is broken

      --囧,就是这个方法是不能用了?继续谷歌之后得知

      child_process.fork是无法运行js文件,它是直接运行执行命令nw 文件夹
      ,所以修改一下,在child文件夹中也放一个package.json文件,执行后,果然成功了。

      --然后又留下一个大问题,无法使用fork的通信接口,囧,最后只好用tcp来实现进程通信。

      --当我想打包成app测试的时候,发现,压根就不会运行子进程child

      因为child_process.fork是运行nw命令,所以,打包后是没有nw命令

    2. 利用NodeJS的webworker来执行

      npm install node-webworker

      之后引用worker.js

      var Worker  = require("worker.js");
      var workker = new Worker("child.js");
      worker.onmessage = function(data){
          console.log(data);
      }
      worker.postmessage({msg:'hello'});

      运行后,发现child.js中的任何信息都无法传递回给父进程,最后发现在worker.impl.buffer中保存了相关信息。

      var timeId = setInterval(function(){
          var msg = worker.impl.buffer;
          if(!msg)return false;
          console.log(msg);
          worker.imple.buffer = "";
      },1000);

      虽然很挫,但还是实现了功能了,打包测试,发现一切OK。发送到其它电脑测试,提示:

      spawn node not found,就是需要执行的命令找不到

      奇怪,我没调用spawn,哪来找不到?打开worker.js的源码查看,囧,发现:

      child_process.spawn("node xxx.js");

      囧,原来它是执行了node的命令来实现子进程,坑爹了。

    3. 利用HTML5的webworker

      var worker = new Worker("child.js");
      worker.onmessage = function(data){};
      worker.postmessage("hello");

      测试后,发现成功运行,消息也正常接收,可...webworker不支持运行nodejs代码,就是grunt无法跑起来。


    三.目前可用方案

    1. 采用非子进程方式

      • 无法同时跑多个grunt任务
      • grunt没有提供结束的方法
      • 需要手动清除grunt的watch任务以及很多变量值,比较麻烦
      • 出错很可能会直接结束程序
    2. 独立将child内容打包成可执行文件,采用child_process.spawn执行

      • 需要打开两个可执行文件,两个加起来至少也有80M
      • 开发时,需要用fork,打包时候用spawn
    3. 安装NodeJS,采用webworker方式

      • 电脑必须安装了NodeJs
      • 目前较好的方案
      • 未来nodewebkit支持子进程方式,可以比较方便修改过来

    PS:暂时还没发现其它可以跑子进程方式,求其他大神解救

  • 相关阅读:
    【乱侃】How do they look them ?
    【softeware】Messy code,some bug of Youdao notebook in EN win7
    【随谈】designing the login page of our project
    【web】Ad in security code, making good use of resource
    SQL数据库内存设置篇
    关系数据库的查询优化策略
    利用SQL未公开的存储过程实现分页
    sql语句总结
    sql中使用cmd命令注销登录用户
    SQLServer 分页存储过程
  • 原文地址:https://www.cnblogs.com/floyd/p/3309657.html
Copyright © 2011-2022 走看看