Node-vibrant: اطلب نسخة قابلة للاستخدام في رد الفعل الأصلي

أمم. أعتقد أنني ساذج بشأن توقع أن تعمل وحدات العقدة في تفاعل أصلي. لقد اكتشفت أن هذه المشكلة بالتحديد تنشأ لأن أداة تجميع التفاعل الأصلية تكرم الحقل browser في package.json لذلك يتم تحميل إصدار المتصفح بدلاً من إصدار العقدة. يتطلب الأمر node-vibrant/lib/index للتغلب على هذا ، لكن الخطأ التالي هو Requiring unknown module 'fs'

chetstone هل جربت rn-nodeify ؟ لن تعمل وحدات العقدة الأساسية افتراضيًا في تطبيق RN لأنها لا تعمل فعليًا على العقدة (V8) ، ولكن JSC. إنه ليس مضادًا للرصاص ، ولكنه يعمل بشكل جيد في تجربتي.

بعد قولي هذا ، أواجه مشكلة مع حيوية العقدة. هل يمكنك تجربته أيضًا ومعرفة من أين تحصل عليه؟ ليس لدي مشكلة مع fs ، لكنني أعتقد أن الاختراقات rn-nodeify مقابل stream في pngjs أو وحدات البث المباشر لا تتم إضافتها - فقط حدس.

تحرير: قد يكون هذا مناسبًا إذا كان متعلقًا بـ pngjs: https://github.com/lukeapage/pngjs/issues/64

(كمرجع)

├─┬ [email protected]
│ ├─┬ [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├─┬ [email protected]
│ │ │ ├── [email protected]
│ │ │ ├── [email protected]
│ │ │ ├── [email protected]
│ │ │ ├─┬ [email protected]
│ │ │ │ ├── [email protected]
│ │ │ │ └─┬ [email protected]
│ │ │ │   └── [email protected]
│ │ │ ├─┬ [email protected]
│ │ │ │ ├── [email protected]
│ │ │ │ ├─┬ [email protected]
│ │ │ │ │ ├── [email protected]
│ │ │ │ │ └── [email protected]
│ │ │ │ └── [email protected]
│ │ │ └── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├─┬ [email protected]
│ │ │ └── [email protected]
│ │ ├── [email protected]
│ │ └─┬ [email protected]
│ │   └── [email protected]
│ ├── [email protected]
│ └─┬ [email protected]
│   ├── [email protected]
│   └── [email protected]

همم. يبدو أن PL # 21 السابق يشير إلى عقدة نابضة بالحياة مرة واحدة مع React Native.
لم أجرب React Native حتى الآن.ولكن إذا تم تحميل lib/index.js كبرنامج نصي للإدخال ، فيجب أن يكون تطبيق الصورة الافتراضي هو nodejs. (انظر https://github.com/akfish/node-vibrant/blob/master/src/index.coffee)
يمكنك محاولة استيراد صورة العقدة بنفسك عن طريق:

// var Vibrant = require('node-vibrant')
// var NodeImage = require('node-vibrant/lib/image/node')

// var v = new Vibrant(uri, {Image: NodeImage})

تحرير: لا تهتم. فقط رأيت التعليقات المتبعة. إذا لم يعمل require('node-vibrant/lib/index') فلن تعمل الطريقة أعلاه أيضًا.

سوف أقوم بإعداد React Native وإجراء بعض الاختبارات بمجرد حصولي على الوقت.

stovmascript شكرًا على React-Nativify الذي يبدو وكأنه نهج واعد ولكن لم يكن لدي الوقت

chetstone Cool ، بدوره ، شكرًا على التنبيهات حول ReactNativity. لقد جربتها للتو وأحبها بشكل أفضل. هناك مفاضلات بالرغم من ذلك.

مع rn-nodeify ، يتم الاعتناء بكل شيء تقريبًا من أجلك. عليك فقط أن تتذكر تشغيل البرنامج النصي postinstall بعد تثبيت الحزم الجديدة (أي أنه سيتم تشغيله بعد npm install ، لكن ليس بعد npm install some-package --save ). الشيء غير الجميل هو أنه ما لم تقم بحفظ واستعادة الحزمة الخاصة بك. json قبل وبعد انتهاء rn-nodeify ، ستضيف مجموعة من الأشياء إليها ، والتي لا يجب أن تكون موجودة بشكل أساسي إذا أضفت البرنامج النصي لما بعد التثبيت . كما أنه يدخل في وحداتك node_modules ويبدأ العبث مباشرة - من ناحية أخرى ، إذا لم يكسر أي شيء ، فمن يهتم ، فهو gitignored بشكل صحيح؟ لقد كنت أستخدم هذا الحل حتى الآن وكنت سعيدًا به.

يعد حل ReactNativity أكثر أناقة من IMO حيث يمكنك توفير وظيفة محول الحزمة الخاصة بك إلى RN Packager (رائع جدًا) ويمكنك استخدام babel-plugin-Rewrite-need لتغيير require() المكالمات أو import s من وحدات العقدة الأساسية لإصدارات المستعرض أثناء التجميع. لديك أيضًا قدر أكبر من التحكم في التبعيات - يمكنك تثبيت جميع إصدارات المتصفح دفعة واحدة إما باستخدام متصفح node-libs أو المتصفح (يوفر كلاهما كائنًا مع تعيينات لإصدارات المتصفح ، والتي ستحتاج إلى تكوين المكون الإضافي babel ). علاوة على ذلك ، يمكنك إضافة حزم انتقائية مثل رد فعل-أصلية-مستوى-fs لوحدة fs. سيتعين عليك اختبار تطبيقك بدقة باستخدام هذا الحل لأنه أكثر عرضة لاستثناءات وقت التشغيل - فليس كل libs العقدة الأساسية لها نظراء في المتصفح و rn-nodeify يذهب إلى أبعد من ذلك لمحاولة معالجة هذا الأمر. الشيء نفسه ينطبق على العقدة العالمية مثل process أو __dirname - توفر rn-nodeify رقة واسعة جدًا لهذه ، ولكن مع طريقة ReactNativity ، سيتعين عليك الحفاظ على الرقاقة الخاصة بك.

بكلتا الطريقتين ، وصلت إلى نفس النقطة التي اعتقدت ...

بعد الاستيراد مثل هذا:

import Vibrant from 'node-vibrant/lib';

أتلقى هذا الخطأ:

قد يكون النموذج الأولي للكائن كائنًا أو فارغًا فقط: غير محدد

نشأت في: _node_modules / وراث / وراث_browser.js: 5_ (إصدار المتصفح من الوحدة يرث).

إذا قمت بتحديث هذه الوظيفة بالعقدة التي تستخدمها حاليًا ، فسيؤدي ذلك إلى تشغيل الخطأ المخصص الجديد:

يجب أن يكون للمُنشئ الفائق "يرث" نموذجًا أوليًا

يبدو أن هذا يحدث لأن المُنشئ الفائق الذي من المفترض أن يتم تمريره إلى هذه الوظيفة ليس مُنشئًا ، ولكنه في الواقع فئة مُنشأة ، لذلك عندما تقوم بتغيير superCtor = superCtor.constructor ، فإنه يعمل.

بعد تتبع المكدس ، يؤدي إلى حزمة الطلب التي يستخدمها jimp ، ولكن ما إذا كانت مشكلة في الطلب أو عدم استخدام jimp للطلب بشكل صحيح ، لا أعرف. من المرجح أن تعمل بشكل جيد في العقدة ، ولكنها تتعطل فقط عند تجميعها للمتصفح أو فقط للتفاعل الأصلي حتى.

شكرا جزيلا على التقرير الشامل. فهل التعديلات التي أجريتها على _inherits_ كافية للحصول على عمل حيوي مع RN أم أنك لا تزال عالقًا؟

في 6 تشرين الثاني (نوفمبر) 2016 ، الساعة 07:24 - 0700 ، كتب Martin Šťovíček [email protected] :

chetstone (https://github.com/chetstone) رائع ، بدوره ، شكرًا على التنبيهات حول ReactNativity. لقد جربتها للتو وأحبها بشكل أفضل. هناك مفاضلات بالرغم من ذلك.

مع rn-nodeify ، يتم الاعتناء بكل شيء تقريبًا من أجلك. عليك فقط أن تتذكر تشغيل البرنامج النصي postinstall بعد تثبيت الحزم الجديدة (على سبيل المثال ، سيتم تشغيله بعد تثبيت npm ، ولكن ليس بعد تثبيت npm بعض الحزم - حفظ). الشيء غير الجميل هو أنه ما لم تقم بحفظ واستعادة الحزمة الخاصة بك. json قبل وبعد انتهاء rn-nodeify ، ستضيف مجموعة من الأشياء إليها ، والتي لا يجب أن تكون موجودة بشكل أساسي إذا أضفت البرنامج النصي لما بعد التثبيت . كما أنه يدخل في وحداتك node_modules ويبدأ العبث مباشرة - من ناحية أخرى ، إذا لم يكسر أي شيء ، فمن يهتم ، فهو gitignored بشكل صحيح؟ لقد كنت أستخدم هذا الحل حتى الآن وكنت سعيدًا به.

يعتبر حل ReactNativity أكثر أناقة في IMO حيث يمكنك توفير وظيفة محول الحزمة الخاصة بك إلى RN Packager (رائع جدًا) ويمكنك استخدام babel-plugin-Rewrite-need لتغيير المكالمات المطلوبة () أو الواردات من وحدات العقدة الأساسية إلى إصدارات المستعرض الخاص بهم أثناء التجميع. لديك أيضًا قدر أكبر من التحكم في التبعيات - يمكنك تثبيت جميع إصدارات المتصفح دفعة واحدة إما باستخدام متصفح node-libs أو المتصفح (يوفر كلاهما كائنًا مع تعيينات لإصدارات المتصفح ، والتي ستحتاج إلى تكوين المكون الإضافي babel ). علاوة على ذلك ، يمكنك إضافة حزم انتقائية مثل رد فعل-أصلية-مستوى-fs لوحدة fs. سيتعين عليك اختبار تطبيقك بدقة باستخدام هذا الحل لأنه أكثر عرضة لاستثناءات وقت التشغيل - فليس كل libs العقدة الأساسية لها نظراء في المتصفح و rn-nodeify يذهب إلى أبعد من ذلك لمحاولة معالجة هذا الأمر. الشيء نفسه ينطبق على العقدة الكروية مثل process أو __dirname - توفر rn-nodeify رقاقات واسعة جدًا لهذه ، ولكن مع طريقة ReactNativity ، سيتعين عليك الحفاظ على الرقاقة الخاصة بك.

بكلتا الطريقتين ، وصلت إلى نفس النقطة التي اعتقدت ...

بعد الاستيراد مثل هذا:

استيراد نابض بالحياة من "node-vibrant / lib"

أتلقى هذا الخطأ:

قد يكون النموذج الأولي للكائن كائنًا أو فارغًا فقط: غير محدد

نشأت في: node_modules / ورث / ورث_browser.js: 5 (إصدار المتصفح من وحدة يرث).

إذا قمت بتحديث هذه الوظيفة بالعقدة التي تستخدمها حاليًا (https://github.com/nodejs/node/blob/master/lib/util.js#L956-L969) ، فسيؤدي ذلك إلى تشغيل الخطأ المخصص الجديد:

يجب أن يكون للمُنشئ الفائق "يرث" نموذجًا أوليًا

يبدو أن هذا يحدث لأن المُنشئ الفائق الذي من المفترض أن يتم تمريره إلى هذه الوظيفة ليس مُنشئًا ، ولكنه في الواقع فئة مُنشأة ، لذلك عندما تقوم بتغيير superCtor (https://github.com/isaacs/inherits/blob/master /inherits_browser.js#L3) إلى: superCtor = superCtor.constructor ، إنه يعمل.

بعد تتبع المكدس ، يؤدي إلى حزمة الطلب التي يستخدمها jimp ، ولكن ما إذا كانت مشكلة في الطلب أو عدم استخدام jimp للطلب بشكل صحيح ، لا أعرف. من المرجح أن تعمل بشكل جيد في العقدة ، ولكنها تتعطل فقط عند تجميعها للمتصفح أو فقط للتفاعل الأصلي حتى.

-
أنت تتلقى هذا لأنه تم ذكرك.
قم بالرد على هذه الرسالة الإلكترونية مباشرةً ، أو قم بعرضها على GitHub (https://github.com/akfish/node-vibrant/issues/29#issuecomment-258684020) ، أو قم بكتم الموضوع (https://github.com/notifications/unsubscribe -auth / AA7l1wl7ggsGTqd7RZlpwWup6T3Ookl7ks5q7eMSgaJpZM4KeOV2).

stovmascript حصل أخيرًا على بعض الوقت لمحاولة استخدام react-nativify . لا أعتقد أنني نجحت في ذلك بقدر ما فعلت. يبدو أن مقدار القرصنة المتضمنة لجعل هذا يعمل قد لا ينتهي تقريبًا.

أولاً ، لم أتمكن من تشغيل المحول. لقد وجدت أخيرًا أن القدرة على تحديد getTransformModulePath() في rn-cli.config.js قد أزيلت من خلال الانحدار في إصداري من رد الفعل الأصلي (0.32.1). لذلك عملت على حل ذلك باستخدام --transformer في الأمر npm start .

بعد ذلك ، لم يتمكن الرابط لسبب ما من العثور على الوحدة النمطية util على الرغم من تثبيتها. والأكثر غرابة ، أنه يبدو أنه يمكن العثور على util عند الطلب من بعض الوحدات ( png.js ) ولكن ليس من وحدات أخرى ( _stream_readable ).

التعليق على طلب util في _stream_readable لمعرفة ما إذا كان بإمكاني المضي قدمًا ، فقد فشل عندما أشار jimp إلى متغيرات لم يتم تحديدها في process الرقائق.

أخيرًا ، بعد قراءة هذا المقال ، أنا مستعد للتخلي عن هذا النهج. لم أحاول استخدام rn-nodify ولكن نظرًا لتجربتك ، أعتقد أنه سيضيع المزيد من الوقت.

يبدو أنه من السهل جدًا إنشاء غلاف أصلي لنظام Android حول مكتبة pallete الفعلية. لا أعرف جافا ، لكن ربما حان الوقت للتعلم. ولن يعمل على نظام iOS ، لكني كنت أستخدم مكون

لقد نشرت للتو لوحة تفاعلية

سيكون من الجيد أيضًا أن يكون لديك حل جافا سكريبت فقط مثل العقدة النابضة بالحياة والتي ستعمل على نظام iOS نظرًا لأن الدعم المحلي غير متوفر إلى حد ما.

آسف على التأخير الطويل. حدثت الحياة الحقيقية.
بناءً على ما أفهمه من التعليقات أعلاه ، يبدو أن المشكلة مرتبطة بمرجع jimp إلى fs ، وهو غير متوفر في بيئة التفاعل الأصلية.

من مصدر jimp [1] ، سيؤدي تعيين process.env.ENVIRONMENT إلى "BROWSER" إلى تخطي طلب الوحدة النمطية fs .

حل بديل محتمل:

// Prevent jimp from requiring `fs`
process.env.ENVIRONMENT = 'BROWSER'
// Require node.js version vibrant explicitly
const Vibrant = require('node-vibrant/lib/index')
// Load image file into a Buffer in some react-native compatible way
let buf = react_native_read_file('path/to/image')
// Pass buffer to node-vibrant
Vibrant.from(buf).getPalette()

هل يمكن لأي شخص التحقق مما إذا كان هذا النهج سيعمل؟ شكرا.

تذكير بأن GitHub لديه 👍 ردود فعل على المشكلات لإظهار الدعم دون انسداد الخيط

تعطل أحدث إصدار لديك "3.2.0-alpha" في React Native مع ظهور خطأ "Can't find variable: self"
وبعد حذف سلسلة واحدة فقط:
import * as Vibrant from 'node-vibrant';
التطبيق يعمل ، لذلك لا توجد إمكانية حتى لاختباره في React Native.

تعطل أحدث إصدار لديك "3.2.0-alpha" في React Native مع الخطأ _ "لا يمكن العثور على المتغير: self" _
وبعد حذف سلسلة واحدة فقط:
import * as Vibrant from 'node-vibrant';
التطبيق يعمل ، لذلك لا توجد إمكانية حتى لاختباره في React Native.

أنا آسف لأنني لا أفهمها حقًا ، هل يعمل lib النابض بالحياة مع RN أم لا؟

Psiiirus يجب أن يعمل في بناء غير ألفا

أنا أتلقى Can't find variable: document في رد الفعل الأصلي.