javascript - 如何使 Zepto 与 Browserify 兼容？

Question

我对 Zepto 做了一些更改，希望可以在 Browserify 中使用它:

➤➤ git diff
diff --git a/package.json b/package.json
index 294af90..e4f8fd1 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     , "dist": "coffee make dist"
     , "start": "coffee test/server.coffee"
   }
+  , "main": "dist/zepto.js"
   , "repository": {
       "type": "git"
     , "url": "https://github.com/madrobby/zepto.git"
diff --git a/src/zepto.js b/src/zepto.js
index 93bfe18..cdf8929 100644
--- a/src/zepto.js
+++ b/src/zepto.js
@@ -787,6 +787,17 @@ var Zepto = (function() {
   return $
 })()

-// If `$` is not yet defined, point it to `Zepto`
-window.Zepto = Zepto
-'$' in window || (window.$ = Zepto)
+// detect module loader like jQuery
+// http://code.jquery.com/jquery-2.0.3.js
+if ( typeof module === "object" && module && typeof module.exports === "object" ) {
+  module.exports = Zepto;
+} else {
+  if ( typeof define === "function" && define.amd ) {
+    define( "zepto", [], function () { return Zepto; } );
+  }
+}
+if ( typeof window === "object" && typeof window.document === "object" ) {
+  window.Zepto = Zepto
+  // If `$` is not yet defined, point it to `Zepto`
+  '$' in window || (window.$ = Zepto)  
+}

但是我遇到了错误:

/usr/lib/node_modules/watchify/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:91
                        var dir = path.resolve(x, pkg.main);
                                                     ^
TypeError: Cannot read property 'main' of undefined
    at /usr/lib/node_modules/watchify/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:91:54
    at load (/usr/lib/node_modules/watchify/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:54:43)
    at /usr/lib/node_modules/watchify/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:60:22
    at /usr/lib/node_modules/watchify/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:16:47
    at Object.oncomplete (fs.js:107:15)

有什么解决办法吗？

Answer 1

您可以手动将 module.exports = window.$ 添加到 zepto 文件底部或使用 browserify-shim以便让您的模块即时适应 browserify。

我会推荐后一个选项，因为编辑第 3 方模块是有问题的，特别是如果您打算稍后升级它们。

browserify-shim 是 tested to work with zepto in particular .

花点时间研究自述文件和示例，以了解如何正确设置。当然，您可以填充几乎任何将变量附加到全局上下文的库，即 jquery。

另一方面，您遇到的错误是由于 browserify 中的错误而导致的，该错误已同时得到修复。