Apollo-link: La importación observable zen rompe las consultas en apollo-client cuando se transpila

Tengo el mismo problema pero con error de diferencia.

Mi codigo esta aqui.

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)

Probé este trabajo alrededor y obtuve el mismo error con el de

`` js
importar 'isomorphic-fetch'
importar * como apolloLink desde 'apollo-link'
importar Observable de 'observable zen'
apolloLink.Observable = Observable
`` ``

@stevestreza @mizchi ¿qué versiones de apollo-client y apollo-link estás usando?

El mismo problema aquí, con [email protected] en un proyecto de paquete web, solucionado eliminando * as en la declaración de importación, como señaló @stevestreza .

El mismo problema aquí.

Lo mismo aquí, y me gustaría agregar que el problema no está dentro de Webpack, como está escrito en SO, sino en Apollo y / o TypeScript.

La razón por la que sé es que estoy usando Rollup para crear un paquete en lugar de Webpack.

Creo que este es un error de TypeScript + Rollup, pero me sorprende que no se manifieste en nuestras propias compilaciones de Rollup. ¿Alguien aquí estaría dispuesto a abrir una solicitud de extracción haciendo el cambio sugerido anteriormente?

El mismo problema aquí con Rollup. Tampoco estoy usando TypeScript.

Parece que TS está jodido. Intenté construir el módulo para corregir los errores, pero recibía errores de TS.

Hola, disculpe mi pregunta, pero ¿alguien tiene una revisión mientras se resuelve esto? ¿Alguna idea de cuál fue la última versión estable?

en mis investigaciones hasta ahora, creo que este problema solo ocurre fuera de create-react-app. por lo que hay una suposición implícita dentro de create-react-app que no está siendo documentada y que está causando este problema _super.call is not a function .

El mismo problema aquí, acabo de seguir el documento en un nuevo proyecto y obtuve este error. No puedo continuar con Apollo.

solo vinculando mi otro problema aquí: https://github.com/apollographql/apollo-client/issues/2785#issuecomment -354169337 donde hay una solución propuesta (no la he probado)

no estoy seguro si esto está relacionado pero ...

Estoy usando rollup para crear un paquete para una aplicación de reacción muy simple. todo funciona bien hasta que intento introducir apollo-client en la mezcla.

siguiendo la documentación aquí: https://www.apollographql.com/docs/react/basics/setup.html#installation

después de intentar compilar el proyecto con rollup, aparece el siguiente error durante la compilación:

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: }

He intentado cambiar la importación en node_modules/apollo-link/lib/link.js a import Observable from 'zen-observable'; como se sugiere en el problema relacionado anterior, pero no parece solucionar el problema.

Estoy enfrentando un problema con zen-observable que es bastante diferente. por favor echa un vistazo a
https://github.com/apollographql/apollo-link/issues/389
y sugerir si estoy haciendo algo mal.

Estoy tan luchando que no tengo más remedio que usar el siguiente truco para solucionar este problema ...

webpack.config.js

      {
        test: /node_modules\/apollo-link.*?\/lib\/.*?.js/,
        loader: 'string-replace-loader',
        options: {
          search: 'exports.Observable = Observable',
          replace: 'exports.Observable = Observable.default'
        }
      },

Realmente desearía poder obtener ayuda aquí para poder eliminar este truco ...

PD: no uso TypeScript, solo babel. No estoy seguro de si esta es la razón por la que se me rompe

Recibo el mismo error sin mecanografiar y puedo dar fe de que realizar el cambio

import * as Observable from 'zen-observable';
para:
import Observable from 'zen-observable';

soluciona el problema

Maldita sea @kinyat, no tenía idea de que pudieras hacer eso con webpack. ¡¡¡TIL !!! ¡¡¡gracias!!!

El mismo problema en una aplicación básica de Hello World con react-apollo y parcel-bundler . ¿Alguna solución legal ?

@alapini Creo que una de las soluciones "legales" es que Apollo proporcione al usuario no mecanografiado (es decir, Babel) una versión ES5 del compilador ts.

Estoy usando apollo para mi complemento vuex-orm-apollo y cambiar archivos dentro de node_modules no es una opción viable para mí. ¡Una corrección de errores pronto estaría muy bien! :)

con la última versión de mecanografiado, las importaciones se pueden expresar en la sintaxis normal de los módulos es, por lo que tal vez si todos esperamos a que Apollo actualice la versión mecanografiada, esto funcionará de inmediato para los que no sean usuarios de TS.

Creo que me encuentro con algunos de los mismos problemas que se enumeran aquí. Es la primera vez que uso apollo, así que no estoy 100% seguro de si estoy conectando las cosas correctamente. Estoy usando un resumen sin mecanografiar con inferno.

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

Para aquellos que usan parcel.js, este PR parece solucionar temporalmente el problema: https://github.com/parcel-bundler/parcel/pull/530

No me he sumergido demasiado en este problema, pero parece que el núcleo del problema, como @fathyb señala aquí , es:

El comportamiento actual de Babel es totalmente correcto y respeta la especificación ES6. Importar una exportación predeterminada con un comodín es ilegal, por lo que los errores aquí son legítimos.

Sin embargo, la gente ( # 418 ) y las bibliotecas (antd, @ blueprintjs / core, etc.) todavía confían en esto. La idea es ser más tolerante relajando la especificación en espacios de nombres exóticos.

Entonces, parece que la solución que @stevestreza publicó (eliminando * as ) es una solución legítima para apollo-link, ¿no?

Fwiw, recibí el error _apolloLink.Observable is not a constructor , y desaparece si utilizo el parcel.js PR indicado anteriormente (o vuelvo a parcel.js 1.2.1 como se indica en apollo-client / issues / 2785 )

También tengo este problema al usar Rollup en un proyecto de Vuejs.

gracias por compartir @ tadas412

El PR anterior se publicó en 1.2.0. ¡Avísame si aún no está resuelto!

sigue recibiendo un error con 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

esto parece ser rastreado aquí apollographql / apollo-client / issues / 2785 también

Para mí, funciona con 1.2.0.

@littletower Eso puede sonar estúpido, pero ¿estás seguro de que estás usando 1.2.0? ¿Quizás eliminar el directorio node_modules y reinstalar los paquetes? Sólo preguntaba :)

@phortx sí, ya lo hice :(
Podría agregar que estoy usando suscripciones, no sé si eso cambia algo

@littletower Eso es extraño. Recibía el mismo error con 1.1.0 y 1.2.0 parecía resolverlo. apollo-client tiene una dependencia de apollo-link , por lo que puede ser que su dependencia no se haya actualizado. ¿Puedes crear un repositorio de reproducción?

El cambio definitivamente solucionó el problema real a nivel de código, pero parece que yarn está causando un conflicto.

• Cuando uso npm install para instalar las dependencias, carga apollo-link 1.2.0 sin ningún cambio de apollo-client . Esto funciona muy bien y el problema informado ya no ocurre. (Debe instalar manualmente graphql-tag y quitar las llaves en la importación en src/client/index.js para verificar esto)
• Cuando uso yarn install , instala la versión apollo-link 1.0.0. Cuando yarn add apollo-link para instalar explícitamente 1.2.0, la versión en node_modules/apollo-link convierte en 1.2.0, pero otra versión de apollo-link 1.0.0 se instala en node_modules/apollo-client/node_modules/apollo-link .

En este punto, he superado mi conocimiento sobre cómo funciona el hilo para solucionar esto (esperaría que haya instalado apollo-link 1.2.0, no 1.0.0). Supongo que la solución "correcta" es requerir apollo-link 1.2.0 en package.json por apollo-client . Dejaré una nota en apollographql / apollo-client # 2785.

Sin embargo, de cualquier manera, ¡esto parece estar completamente arreglado aquí!

@evans Creé un repositorio para la reproducción y ¿adivinen qué? No tengo el problema, pero en mi código original todavía lo tengo ... Investigaré más. ¡Gracias por la respuesta!

Recibo el mismo error en un proyecto de Polymer 3 y apollo-boost :

import { HttpLink } from 'apollo-link-http';

causas

Uncaught SyntaxError: The requested module '../../zen-observable/index.js'
                      does not provide an export named 'default'

@heruan ¿Encontraste alguna solución? Estoy enfrentando el mismo problema.