2013-07-21 3 views
0

Я сделал некоторые изменения в зепто и надеюсь, что я могу использовать его в Browserify:Как сделать 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) 

Есть ли решение?

+0

Doe это работает, когда требуется модифицированный файл в node.js? Сначала я проверю, работает ли это. Обратите внимание, что для его работы на стороне сервера вам, скорее всего, придется сначала создать переменную 'global.window', указав на объект окна из JSDom или так. –

+0

О, нет, я все еще хочу использовать его в браузере. – jiyinyiyong

ответ

2

Вы можете добавить module.exports = window.$ в нижней части zepto файла или использовать browserify-shim, чтобы ваши модули были адаптированы для браузера на лету.

Я бы рекомендовал последний вариант, так как редактирование сторонних модулей проблематично, особенно если вы планируете обновить их позже.

browserify-shim был tested to work with zepto in particular.

Найдите минутку, чтобы изучить readme и примеры, чтобы узнать, как правильно настроить вещи. Затем вы можете, конечно, легко подкрасить любую библиотеку, которая привязывает переменную к глобальному контексту, то есть jquery.

С другой стороны, ошибки, которые вы получили, из-за ошибки в браузере, которая была исправлена ​​за это время.

+0

Спасибо, я попробовал (https://github.com/jiyinyiyong/zepto-browserify#zepto-browserify), и это сработало. Мне было довольно сложно понять, как работает Browserify-Shim. Я сделал это, как описано в README раньше, но не смог создать пакет Zepto. – jiyinyiyong

+0

Я сделал ошибки? Используется ли в браузере связывание библиотек, таких как jQuery, в модуль или просто требуется их каждый раз, когда я собираю целую часть кода (что означает, что каждый раз, когда мне приходится модифицировать скрипт для этого)? – jiyinyiyong

+1

Browsify-shim не создает отдельный модуль. Вместо этого он просто обертывает код (т. Е. Zepto), прежде чем он будет добавлен в комплект. Эта оболочка делает ее commonJS compat. Также был разработан браузер-прокладка, поэтому вам не нужно было создавать пользовательские библиотеки **, чтобы получить совместимость с CommonsJS. Так что это не сделано для того, что вы имеете в виду в своем примере, но не нужно это делать;) –