2016-11-01 2 views
11

Я проходил через кодовую базу React, и я заметил, что React's require не совсем ведет себя как в Nodejs. Я не понимаю, что здесь происходит.Невозможно найти модули, требуемые в React

Если вы посмотрите на строку 19 на ReactClass.js, есть require('emptyObject'), но emptyObject не указан в package.json, и он не говорит нигде, откуда приходит этот модуль.

https://github.com/facebook/react/blob/master/src/isomorphic/classic/class/ReactClass.js#L19

я нашел "emptyObject" on npmjs, но API кажется отличается от той, которая используется в React; .isEmpty grepped in React не связан с emptyObject.

Итак, где emptyObject загружается из и как React's require делает то, что он делает? Это неинтуитивно. Вообще.

ответ

14

Адрес модуля emptyObject, к которому относится Реагирование, является https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/emptyObject.js#L9. Обратите внимание, что он не следует системе модулей CommonJS.

Чтобы Facebook мог делиться и использовать собственный JavaScript. В первую очередь это позволит нам отправлять код, не беспокоясь слишком много о том, где он живет, в соответствии с духом @providesModule, но работая в более широкой экосистеме JavaScript.

От https://github.com/facebook/fbjs#purpose

Способ определения модуля путем добавления @providesModule в заголовке лицензии и загрузки этих модулей с require в узле называется Спешка, настроенная модульная система построена для проектов с открытым исходным кодом Facebook.

Фактически, если вы не хотите понимать внутреннюю работу Реагента или вносить вклад в проекты с открытым исходным кодом Facebook, вам не нужно это знать. Другими словами, не рекомендуется использовать Haste для написания собственного проекта.

В том же ключе, модуль invariant загружается в строке 10 из ReactClass.js объявлен в https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/__forks__/invariant.js#L9

Насколько я знаю, как Eclipse, и WebStorm не поддерживают Haste так IDE не может помочь. Но с поспешностью, имя файла и модуля должны быть одинаковыми, так что вы можете найти модуль с помощью функции поиска по имени файла, то есть двойной сдвиг в WebStorm и Ctrl + Сдвиг + г в Eclipse. Тем не менее, emptyObject, о которых вы спрашивали или invariant, не являются частью Реакта, поэтому все еще громоздко, чтобы найти их происхождение.

В противном случае существует команда, которая делится и организует то, что они изучают, из-за взлома. Реагирует, что я иногда вношу свой вклад, и они связали те require s, указав Ускорение на соответствующий файл источника, например. https://annot.io/github.com/facebook/react/blob/cc3dc21/src/isomorphic/classic/class/ReactClass.js?l=19 Возможно, вы захотите это увидеть.

+1

Подробнее о Haste см. В https://facebook.github.io/react/contributing/codebase-overview.html#custom-module-system –

+0

Я не использую ни одну из этих IDE, но я полагаю, что 'find'ing внутри facebook/fbjs dir будет делать? Ссылка annot.io интересна. Благодарю. – omul

+0

Это может раздражать работу с динамическим языком, таким как JavaScript без интегрированной среды разработки, особенно в проектах с подобными facebookisms. Что вы тогда используете? –

4

Я заметил, как React's require не совсем ведет себя как в Nodejs.

Право. У Facebook есть собственный модуль-загрузчик. Все модули имеют уникальные идентификаторы, предоставляемые директивой @providesModule в каждом модуле. Это позволяет использовать идентификатор для загрузки модуля вместо пути к файлу.

Конечно, это не работает в среде на основе Node.js. Поэтому, когда React или любой другой проект Facebook публикуется до npm, все вызовы require автоматически переписываются на то, что понимает узел.

Эта функциональность предоставляется fbjs, которая содержит общие зависимости и создает помощники для всех проектов Facebook. This is where you find the emptyObject module.

Если вы посмотрите на React's gulp file, вы можете увидеть, как построены карты модулей и что пользовательский плагин Babel используется для преобразования всех вызовов require.

+0

Таким образом, файл gulp был так, как 'require' выполнял то, что он делал. Благодарю. Я выбираю ответ @ donghwan-kim, однако, чтобы упомянуть Haste и различные способы найти целевые модули. – omul

Смежные вопросы