نشكرك على تقديم مشكلة على Apollo Link! يرجى التأكد من تضمين المعلومات التالية للتأكد من أن مشكلتك قابلة للتنفيذ. إذا كنت تقدم طلب ميزة ، فلن تحتاج إلى اتباع المخطط التفصيلي أدناه ، ولكن يرجى تضمين "فكرة الميزة" في العنوان وتضمين مثالًا محددًا تكون فيه هذه الميزة مفيدة.
أهلا!
أعمل على إعداد مشروع جديد باستخدام Apollo Client و Apollo Link و babel و webpack. أستخدم قالب مشروع بسيطًا جدًا لإعداده بالاقتراحات الموثقة في عميل Apollo. عندما أذهب لتشغيله وأرسل إليه استعلامًا ، أحصل على استثناء لوقت التشغيل ولا يمكن تنفيذ الاستعلامات. لقد تتبعت ذلك لمعرفة كيفية استيراد الحزمة zen-observable
.
النتيجة المنشودة:
يمكن لـ Apollo Client إجراء استعلام باستخدام Apollo Link ، باستخدام الكود التالي:
import { ApolloClient } from "apollo-client"
import { HttpLink } from "apollo-link-http"
import { InMemoryCache } from "apollo-cache-inmemory"
import { gql } from "graphql-tag"
const graphqlClient = new ApolloClient({
link: new HttpLink(),
cache: new InMemoryCache(),
})
graphqlClient.query({ query: gql`query { counter { count } }` })
.then(console.log)
.catch(console.error)
النتيجة الفعلية:
يطرح عميل Apollo الاستثناء التالي:
TypeError: _super.call is not a function
Stack trace:
ObservableQuery@webpack-internal:///16:56:21
QueryManager</QueryManager.prototype.watchQuery@webpack-internal:///94:404:16
QueryManager</QueryManager.prototype.query/resPromise<@webpack-internal:///94:431:20
QueryManager</QueryManager.prototype.query@webpack-internal:///94:429:26
ApolloClient</ApolloClient.prototype.query@webpack-internal:///93:102:16
@webpack-internal:///59:14:1
[59]<strong i="19">@http</strong>://host/assets/client.js:16:1
__webpack_require__<strong i="20">@http</strong>://host/assets/manifest.js:713:12
fn<strong i="21">@http</strong>://host/assets/manifest.js:118:20
[49]<strong i="22">@http</strong>://host/assets/client.js:7:18
__webpack_require__<strong i="23">@http</strong>://host/assets/manifest.js:713:12
webpackJsonpCallback<strong i="24">@http</strong>://host/assets/manifest.js:26:23
<strong i="25">@http</strong>://host/assets/client.js:1:1
يستورد ObservableQuery
Observable
من مشروع Apollo Link ، الذي يستورده من الحزمة zen-observable
. عند التحويل إلى JavaScript ، فإن حزمة apollo-link تحتوي على هذا عند lib/index.js
:
import * as Observable from 'zen-observable';
export { Observable };
يبدو أن هذا يتسبب في بعض الحالات الغريبة عند التحويل والتصنيف الفرعي لاحقًا لهذه الملاحظة ، ولكن يبدو أن هذا هو المكان الذي تتوقف فيه طريقة call
عن التوفر من خلال التحقيق الخاص بي.
كيفية إعادة إظهار المشكلة:
مرفق مشروع اختباري يجب أن يوضح المشكلة. أفترض أن Node.js v6 أو v8 مثبت مع Yarn. مشروع تجريبي
yarn install
yarn run start
وافتح http: // localhost : 3000 /يمكنك حل هذا عن طريق تغيير node_modules/apollo-link/lib/index.js:3
من:
import * as Observable from 'zen-observable';
إلى:
import Observable from 'zen-observable';
المشكلة هي أنه إذا قمت بإجراء هذا التغيير في ملف .ts المقابل ، فإنه يتسبب في فشل الفحص ، ولست متأكدًا من أفضل السبل لحل ذلك.
توجد هذه المشكلة في StackOverflow مما يشير إلى أن الأشخاص الآخرين يواجهون هذه المشكلة.
شكرًا جزيلاً على وقتك ، ولإلقاء نظرة على تقرير الأخطاء الخاص بي ، وعلى العمل الرائع في Apollo!
لدي نفس المشكلة ولكن مع خطأ الاختلاف.
الكود الخاص بي هنا.
import 'isomorphic-fetch'
import { ApolloLink } from 'apollo-link'
import { ApolloClient } from 'apollo-client'
import { HttpLink } from 'apollo-link-http'
import { InMemoryCache } from 'apollo-cache-inmemory'
export default new ApolloClient({
link: new HttpLink({ uri: 'http://localhost:5000/api/graphql' }),
cache: new InMemoryCache()
})
Uncaught (in promise) TypeError: _apolloLink.Observable is not a constructor
at HttpLink.eval [as request] (httpLink.js:98)
at eval (link.js:60)
at ApolloLink.eval [as request] (ApolloClient.js:30)
at ApolloLink.eval [as request] (link.js:59)
at execute (link.js:94)
at eval (QueryManager.js:134)
at new Promise (<anonymous>)
at QueryManager.mutate (QueryManager.js:129)
at ApolloClient.mutate (ApolloClient.js:109)
at Header.componentDidMount (index.js:53)
لقد جربت هذا العمل وحصلت على نفس الخطأ مع stevestreza .
شبيبة
استيراد "إحضار متماثل الشكل"
استيراد * كـ apolloLink من "رابط أبولو"
استيراد يمكن ملاحظته من "zen-ملحوظ"
apolloLink.Observable = يمكن ملاحظته
""
stevestrezamizchi ما إصدارات أبولو العميل وأبولو الارتباط الذي تستخدمه؟
نفس المشكلة هنا ، مع [email protected] في مشروع webpack ، تم إصلاحها عن طريق إزالة * as
في بيان الاستيراد ، كما أشار stevestreza .
نفس المشكلة هنا.
نفس الشيء هنا ، وأود إضافة المشكلة ليست داخل Webpack ، كما هو مكتوب في SO ، ولكن في Apollo و / أو TypeScript.
السبب الذي أعرفه هو أنني أستخدم Rollup لإنشاء حزمة بدلاً من Webpack.
أعتقد أن هذا خطأ في TypeScript + Rollup ولكنني مندهش من أنه لا يظهر في إصدارات Rollup الخاصة بنا. هل سيكون أي شخص هنا مستعدًا لفتح طلب سحب لإجراء التغيير المقترح أعلاه؟
نفس المشكلة هنا مع التراكمي. أنا لا أستخدم Typescript أيضًا.
يبدو أن TS معطل بالكامل. حاولت بناء الوحدة لإصلاح الأخطاء ولكني كنت أحصل على أخطاء TS.
مرحبًا ، عفواً عن سؤالي ولكن هل لدى أي شخص إصلاح عاجل أثناء حل هذه المشكلة؟ أي فكرة عن آخر نسخة مستقرة؟
في تحقيقاتي حتى الآن ، أعتقد أن هذه المشكلة تحدث فقط خارج تطبيق create-response-app. لذلك ، هناك بعض الافتراضات الضمنية داخل تطبيق create-response- التي لم يتم توثيقها والتي تسببت في حدوث مشكلة _super.call is not a function
.
نفس المشكلة هنا ، لقد تابعت للتو المستند في مشروع جديد تمامًا وتلقيت هذا الخطأ. أنا غير قادر على الاستمرار مع أبولو.
فقط اربط مشكلتي الأخرى هنا: https://github.com/apollographql/apollo-client/issues/2785#issuecomment -354169337 حيث يوجد إصلاح مقترح (لم أختبر)
لست متأكدًا مما إذا كان هذا مرتبطًا ولكن ...
أستخدم التراكمي لإنشاء حزمة لتطبيق تفاعل بسيط للغاية. كل شيء يسير على ما يرام حتى أحاول إدخال عميل أبولو في المزيج ..
باتباع الوثائق هنا: https://www.apollographql.com/docs/react/basics/setup.html#installation
بعد محاولة إنشاء المشروع باستخدام مجموعة التحديثات ، تلقيت الخطأ التالي أثناء الإنشاء:
of is not exported by node_modules/zen-observable/index.js
47: return new ApolloLink(function (operation, forward) {
48: return (firstLink.request(operation, function (op) {
49: return nextLink.request(op, forward) || Observable.of();
^
50: }) || Observable.of());
51: });
node_modules/apollo-link/lib/link.js
of is not exported by node_modules/zen-observable/index.js
48: return (firstLink.request(operation, function (op) {
49: return nextLink.request(op, forward) || Observable.of();
50: }) || Observable.of());
^
51: });
52: }
node_modules/apollo-link/lib/link.js
of is not exported by node_modules/zen-observable/index.js
74: export { ApolloLink };
75: export function execute(link, operation) {
76: return (link.request(createOperation(operation.context, transformOperation(validateOperation(operation)))) || Observable.of());
^
77: }
حاول ive تغيير الاستيراد في node_modules/apollo-link/lib/link.js
إلى import Observable from 'zen-observable';
كما هو مقترح في المشكلة ذات الصلة أعلاه ولكن لا يبدو أنه يحل المشكلة.
أواجه مشكلة مع zen-Observable وهي مختلفة تمامًا. الرجاء إلقاء نظرة على
https://github.com/apollographql/apollo-link/issues/389
واقترح ما إذا كنت أفعل شيئًا خاطئًا.
أنا أكافح بشدة لدرجة أنه ليس لدي خيار سوى استخدام الاختراق التالي للتغلب على هذه المشكلة ...
webpack.config.js
{
test: /node_modules\/apollo-link.*?\/lib\/.*?.js/,
loader: 'string-replace-loader',
options: {
search: 'exports.Observable = Observable',
replace: 'exports.Observable = Observable.default'
}
},
أتمنى حقًا أن أحصل على بعض المساعدة هنا حتى أتمكن من إزالة هذا الاختراق ...
ملاحظة: أنا لا أستخدم TypeScript ولكن مجرد بابل. لست متأكدًا مما إذا كان هذا هو سبب كسرها بالنسبة لي
أحصل على نفس الخطأ بدون الكتابة المطبوعة ويمكنني أن أؤكد أن إجراء التغيير
import * as Observable from 'zen-observable';
إلى:
import Observable from 'zen-observable';
يصلح المشكلة
لعنة kinyat لم يكن لدي أي فكرة أنه يمكنك فعل ذلك باستخدام webpack. سمسم !!! اشكرك!!!
نفس المشكلة في تطبيق Hello World الأساسي باستخدام react-apollo
و parcel-bundler
. أي حل قانوني ؟
alapini أعتقد أن أحد الحلول "القانونية" هو أن توفر Apollo للمستخدم غير المطبوع على الحروف (مثل Babel) إصدار ES5 من مترجم ts.
أنا أستخدم Apollo للمكوِّن الإضافي vuex-orm-apollo وتغيير الملفات داخل node_modules
ليس خيارًا قابلاً للتطبيق بالنسبة لي. سيكون إصلاح الخلل قريبًا رائعًا حقًا! :)
مع أحدث إصدار من الكتابة المطبوعة ، يمكن التعبير عن الواردات في بناء جملة وحدات es العادية ، لذلك ربما إذا انتظرنا جميعًا حتى يقوم Apollo بترقية الإصدار المطبوع عليه ، فسيعمل هذا خارج الصندوق بالنسبة لنا غير مستخدمي TS.
أعتقد أنني أواجه بعض المشكلات نفسها المدرجة هنا. أول مرة أستخدم فيها Apollo ، لذلك لست متأكدًا بنسبة 100٪ إذا كنت أقوم بتوصيل الأشياء بشكل صحيح. أنا أستخدم تراكمي بدون نسخة مطبوعة مع الجحيم.
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
'of' is not exported by 'node_modules/zen-observable/index.js'
'of' is not exported by 'node_modules/zen-observable/index.js'
'of' is not exported by 'node_modules/zen-observable/index.js'
(node:37350) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: 'print' is not exported by node_modules/graphql/language/printer.js
(node:37350) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code
بالنسبة لأولئك الذين يستخدمون parcel.js ، يبدو أن هذه العلاقات العامة تعمل على حل المشكلة: https://github.com/parcel-bundler/parcel/pull/530
لم أتعمق كثيرًا في هذه المشكلة ، لكن يبدو أن جوهر المشكلة ، كما يلاحظ fathyb هنا ، هو:
سلوك Babel الحالي صحيح تمامًا ويحترم مواصفات ES6. يعد استيراد تصدير افتراضي باستخدام حرف بدل غير قانوني ، لذا فإن الأخطاء هنا شرعية.
ومع ذلك ، لا يزال الأشخاص ( # 418 ) والمكتبات (antd ، @ blueprintjs / core ، إلخ ..) يعتمدون على هذا. الفكرة هي أن تكون أكثر تسامحًا من خلال تخفيف المواصفات على مساحات الأسماء الغريبة.
لذلك يبدو أن الحل البديل stevestreza المنشور (إزالة * as
) هو إصلاح شرعي لـ apollo-link ، أليس كذلك؟
Fwiw ، كنت أتلقى الخطأ _apolloLink.Observable is not a constructor
، وسيختفي إذا استخدمت parcel.js PR المشار إليه أعلاه (أو عدت إلى parcel.js 1.2.1 كما هو مذكور في apollo-client / issues / 2785 )
أواجه هذه المشكلة أيضًا باستخدام Rollup في مشروع Vuejs.
شكرا للمشاركة @ tadas412
تم نشر العلاقات العامة أعلاه في 1.2.0. اسمحوا لي أن أعرف إذا لم يتم حلها بعد!
لا يزال هناك خطأ مع 1.2.0 😢
TypeError: _super.call is not a function
at new ObservableQuery
at QueryManager.watchQuery
at eval
at new Promise
at QueryManager.query
at ApolloClient.query
at VueComponent.created
يبدو أن هذا يتم تتبعه هنا apollographql / apollo-client / issues / 2785 أيضًا
بالنسبة لي ، إنه يعمل مع 1.2.0.
littletower قد يبدو هذا غبيًا ، لكن هل أنت متأكد من أنك تستخدم 1.2.0؟ ربما حذف node_modules dir وإعادة تثبيت الحزم؟ فقط أتسائل :)
phortx نعم فعلت ذلك بالفعل :(
قد أضيف أنني أستخدم الاشتراكات ، لا أعرف ما إذا كان ذلك يغير شيئًا
littletower هذا غريب. كنت أتلقى نفس الخطأ مع 1.1.0 و 1.2.0 على ما يبدو لحلها. يعتمد apollo-client
على apollo-link
، لذلك ربما لم يتم تحديث التبعية. هل يمكنك إنشاء إعادة استنساخ؟
أدى التغيير بالتأكيد إلى إصلاح المشكلة الفعلية على مستوى الكود ، ولكن يبدو أن yarn
يتسبب في حدوث تعارض.
npm install
لتثبيت التبعيات ، يتم تحميل apollo-link
1.2.0 بدون أي تغيير من apollo-client
. يعمل هذا بشكل رائع ولم تعد المشكلة التي تم الإبلاغ عنها تحدث. (يجب عليك تثبيت graphql-tag
يدويًا وإزالة الأقواس في الاستيراد في src/client/index.js
للتحقق من ذلك)yarn install
، يتم تثبيت الإصدار apollo-link
1.0.0. عندما أقوم yarn add apollo-link
لتثبيت 1.2.0 بشكل صريح ، يصبح الإصدار الموجود في node_modules/apollo-link
1.2.0 ، ولكن يتم تثبيت إصدار آخر من apollo-link
1.0.0 بسعر node_modules/apollo-client/node_modules/apollo-link
.لقد تجاوزت معرفتي في هذه المرحلة حول كيفية عمل الغزل لإصلاح هذا (أتوقع أن يكون قد تم تثبيت apollo-link
1.2.0 ، وليس 1.0.0). أعتقد أن الإصلاح "الصحيح" هو طلب apollo-link
1.2.0 في package.json مقابل apollo-client
. سأقوم بإسقاط ملاحظة في apollographql / apollo-client # 2785.
في كلتا الحالتين ، يبدو أن هذا ثابت تمامًا هنا!
evans لقد أنشأت الريبو للتكاثر
أتلقى نفس الخطأ في مشروع Polymer 3 و apollo-boost
:
import { HttpLink } from 'apollo-link-http';
الأسباب
Uncaught SyntaxError: The requested module '../../zen-observable/index.js'
does not provide an export named 'default'
heruan هل وجدت أي حل؟ أواجه نفس المشكلة.
التعليق الأكثر فائدة
أنا أكافح بشدة لدرجة أنه ليس لدي خيار سوى استخدام الاختراق التالي للتغلب على هذه المشكلة ...
webpack.config.js
أتمنى حقًا أن أحصل على بعض المساعدة هنا حتى أتمكن من إزالة هذا الاختراق ...
ملاحظة: أنا لا أستخدم TypeScript ولكن مجرد بابل. لست متأكدًا مما إذا كان هذا هو سبب كسرها بالنسبة لي