0

我应该使用哪种 javascript 模式来构建 javascript 库？

我如何使用 UMD（https://github.com/umdjs/umd）构建一个能够处理 node.js、jquery 和浏览器的模块？

我不知道如何将示例 node.js + 浏览器 ( https://github.com/umdjs/umd/blob/master/jqueryPluginCommonjs.js ) 与 jquery + 浏览器 ( https://github.com/ umdjs/umd/blob/master/commonjsAdapter.js）到 jquery + node.js + 浏览器。

4

2 回答 2

1

听起来你想要这个模块。

它与我最近使用的模块模式非常相似，它适用于 nodeJs、AMD 和浏览器 Javascript。

;(function (global) {
  function moduleDefinition(/*dependency*/) {
    'use strict';

    function module() {
      // module code goes here
    }

    return module;

  } if (typeof exports === 'object') {
    // node export
    module.exports = moduleDefinition(/*require('dependency')*/);
  } else if (typeof define === 'function' && define.amd) {
    // amd anonymous module registration
    define([/*'dependency'*/], moduleDefinition);
  } else {
    // browser global
    global.module = moduleDefinition(/*global.dependency*/);
  }
}(this));

为了透明起见，我认为这段代码来自这里。

于 2013-09-10T14:07:31.390 回答
1

您链接的代码中的示例对我来说很清楚。你把你的 jquery 模块写成一个普通的 jquery 模块到第 21 行的块中。

(function ($) {
    $.fn.jqueryPluginCommonJs = function () {};
})

上面的部分都是关于文件如何检测它所在的环境，你不需要触摸这个位：

function (factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define(['jquery'], factory);
    } else if (typeof exports === 'object') {
        // Node/CommonJS
        factory(require('jquery'));
    } else {
        // Browser globals
        factory(jQuery);
    }

然后当你的文件完成后，你将它保存为一个单独的 js 文件，然后使用脚本标签将它加载到浏览器中，或者使用“require”语句将它加载到你的 nodejs 环境中。

因为它是一个 jQuery 插件，所以只有在运行此代码时已经加载了 jquery，或者当您需要文件时 jquery 在 nodejs 中运行时，它才会在浏览器中工作。（文件顶部的加载器的 nodejs 位将尝试在节点中为您加载 jquery，但您仍然必须使用 npm 安装它）。

每个人都对您的问题如此困惑的原因是因为很难看出在 vanilla nodejs 中使用 jquery 插件有什么意义。jQuery 是一个 DOM 操作库，默认情况下 nodejs 没有 DOM，所以 jQuery 无法帮助您。

如果您使用 jsDOM 之类的东西将 DOM 加载到 nodejs 中，那么您应该已经知道如何将您的 DOM 连接到您使用此脚本“需要”的 jQuery 实例。

老实说，如果您在理解问题中发布的 20 行示例中的任何代码时遇到困难，那么尝试将自定义 jquery 模块加载到 nodejs 中可能还为时过早。

我建议花一些时间真正查看 UMD 文档，直到您正确理解那里发生的一切。这比尝试将自定义 jquery 模块连接到节点中的 DOM 简单一个数量级，并且您所学到的东西将帮助您了解当以后不可避免地出现问题时模块中真正发生的事情。

于 2013-09-10T14:08:04.063 回答