node-webkit 使用requirejs 小结

1. node-webkit 启动页使用requrejs

将webapp中的require改为requirejs，因为requirejs本来就应该用requirejs的，require只是requirejs的一个别名。

requirejs(["angular","script/app","jquery"],function(angular,app){
    angular.element().ready(function(){
        angular.resumeBootstrap([app["name"]]);
    });
});;

 

2. node-webkit前端 requirejs模块中调用node-wbkit的原生api：

nw.gui  是node-webkit native api的模块。

引入 nw.gui 可以通过var gui = require(‘nw.gui’); || global.window.nwDispatcher.requireNwGui()两种方法

因为nw.gui并不是nodejs 的内置的全局模块，使用require(‘nw.gui’)方法必须在启动页中的script标签中执行，  所以如果想做到在一个requrirjs的amd模块或者node-modules下的node文件中调用nw.gui只能使用global.window.nwDispatcher.requireNwGui()(详见 https://github.com/rogerwang/node-webkit/issues/707)

demo :调用node-webkit api  生成原生菜单 ，窗体最小化

define(function(){

    var winMenuCtrl=["$scope","$element",function($scope, element){

        gui=global.window.nwDispatcher.requireNwGui() ;
        var win = gui.Window.get();

        $scope.minimize=function(){
            win.minimize();
            win.on('minimize', function () {
                console.log("窗口最小化")

            });
        }  /* 窗口最小化 */

        creatMenu=function(){
            var menubar = new gui.Menu({ type: 'menubar' });   /*创建一级菜单*/

            var sub1 = new gui.Menu();   /*创建二级菜单*/
            sub1.append(new gui.MenuItem({
                label: '子菜单1',
                click: function() {
                    var element = document.createElement('div');
                    element.appendChild(document.createTextNode('Test 1'));
                    document.body.appendChild(element);
                }
            }));/* 向二级菜单添加menuitem */
            
            
            sub1.append(new gui.MenuItem({
                label: '子菜单2',
                click: function() {
                    var element = document.createElement('div');
                    element.appendChild(document.createTextNode('Test 1'));
                    document.body.appendChild(element);
                }
            }));/* 向二级菜单添加menuitem */
            

            menubar.append(new gui.MenuItem({ label: '菜单1', submenu: sub1 }));  /* 向一级菜单添加menuitem。*/

            var win = gui.Window.get();

            win.menu = menubar;  /* 将一级菜单指定问窗口菜单 */
        }
        creatMenu()/* 生成原生菜单 */

    }]

    return winMenuCtrl
})

　　

 

3.node-webkit 前端requrejs 模块中调用nodejs 模块

解决办法： 保存nodejs 的require方法到全局变量 （在requirejs 加载之前）    

window.requireNode = window.require;

在requirejs 模块中使用window.requireNode加载nodejs的module，之所以没有改变requirejs 

一方面node是最先加载在webview启动之前就加载完成了， 而requiejs是页面启动的时候才加载。

而另一方面 为了保证web端 与客户端代码一直 改动最小的原则

demo :amd模块中调用nodejs 文件系统

define(function(require){

        var d3TestCtrl=["$scope","$element",function($scope, element){
        var d3=require("D3")
         requireNode ('fs').readdir('D:/', function (err, files) {
                if (err) {
                    document.write(err);
                } else {
              
                    for (var i = 0; i < files.length; ++i) {
                        var div = document.createElement('div');
                        div.className = "item";
                        var content = document.createTextNode(files[i]);
                        div.appendChild(content);
                        element[0].appendChild(div);
                        div.onclick = function () {
                        }
                    }
                }
            })

    }]

    return d3TestCtrl
})