React-dnd: La importación del módulo CJS está rota en la última

Creado en 13 jul. 2019 · 29Comentarios · Fuente: react-dnd/react-dnd

Describe el error
Los últimos paquetes de CJS parecen estar dañados (9.3.3). El uso de 9.2.1 funciona. Consulte los códigos y el cuadro o el registro a continuación:

[ error ] ./node_modules/react-dnd-cjs/lib/common/DndContext.js
Module not found: Can't resolve 'dnd-core' in '/mnt/c/dev/foobar/app/node_modules/react-dnd-cjs/lib/common'
{ Error: Cannot find module 'dnd-core'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)

Reproducción

https://codesandbox.io/embed/wonderful-turing-mqywk

bug

Fuente

muratsu

👍19

Comentario más útil

Estoy fuera hasta el 20, siéntete libre de volver a abrir esto si el problema persiste. ¡Gracias!

darthtrevino en 6 ago. 2019

🚀2 👍1

Todos 29 comentarios

+1, en mi escenario webpack build funciona bien, pero mocha --require @babel/register (es decir, entorno de nodo) da el mismo resultado defectuoso.

Además, el subárbol de distribución generado /dist/cjs en [email protected] parece estar roto, he intentado piratear esto en la configuración de babel a través de babel-plugin-module-resolver así, pero sin éxito:

  [
    "babel-plugin-module-resolver",
    {
      alias: {
        "^react-dnd$": "\\0/dist/cjs",
        "^react-dnd-.*$": "\\0/dist/cjs",
        "^dnd-.*$": "\\0/dist/cjs"
      }
    }
  ]

En pocas palabras, esta reescritura a continuación funciona en webpack (con [email protected] ) y también en mocha (con [email protected] ) sin cambios en el código fuente de la aplicación:

  [
    "babel-plugin-module-resolver",
    {
      alias: {
        "^react-dnd$": "\\0-cjs"
      }
    }
  ]

martinschayna en 18 jul. 2019

Frente a este mismo problema.

sarnason en 23 jul. 2019

Me encontré con esto también

takotaco en 27 jul. 2019

@martinschayna , ¿funcionó el segundo recorte? Probé un par de cosas que obtengo No puedo encontrar dnd-core o

/node_modules/dnd-core/dist/esm/index.js:1
(function (exports, require, module, __filename, __dirname) { export * from './interfaces';

sandorfr en 5 ago. 2019

También noté que 9.3.3 no se ha publicado para todos los paquetes. ¿Eso parece un poco raro @darthtrevino ?

sandorfr en 5 ago. 2019

Hice un poco más de investigación sobre esto

Parece que los .d.ts no están parcheados (no estoy seguro de por qué en este momento las reglas scripts/execute_cjs_replacements.js me parecen buenas).

process module requires in /Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd
*.d.ts require replacement [ { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/DndContext.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/DndProvider.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/DragPreviewImage.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/DragSourceMonitorImpl.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/DropTargetMonitorImpl.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/index.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/registration.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/SourceConnector.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/TargetConnector.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/common/wrapConnectorHooks.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/createSourceFactory.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/createTargetFactory.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/decorateHandler.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/disposables.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/DragLayer.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/DragSource.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/DropTarget.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/index.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/interfaces.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/decorators/utils.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/index.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/internal/drag.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/internal/drop.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/internal/useCollector.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/internal/useDragDropManager.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/internal/useMonitorOutput.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/useDrag.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/useDragLayer.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/hooks/useDrop.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/index.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/interfaces/connectors.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/interfaces/hooksApi.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/interfaces/index.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/interfaces/monitors.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/interfaces/options.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/utils/cloneWithRef.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/utils/isRef.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/utils/isValidType.js',
    hasChanged: false },
  { file:
     '/Users/cautexier/projects/react-dnd/packages/alternative_builds/cjs/react-dnd/lib/utils/js_utils.js',
    hasChanged: false } ]
js from replacement []
*.d.ts from from replacement []
*.d.ts from import replacement []

Creo que falta una regla en scripts / execute_cjs_replacements.js para reemplazar las importaciones en archivos js también. Entonces DndContext.js no intenta importar desde dnd-core en node_modules / react-dnd-cjs / lib / common / DndContext.js: 11.

        let jsFromReplaceSpec = {
            files: `${file}/lib/**/*.js`,
            from: esmLibs.map(esmLib => new RegExp(`from '${esmLib}'`, 'g')),
            to: esmLibs.map(esmLib => `from '${esmLib}-cjs'`),
        }
        replace.sync(jsFromReplaceSpec)

sandorfr en 6 ago. 2019

Cojo, haré un corte al arreglar el proceso de lanzamiento.

darthtrevino en 6 ago. 2019

Acabas de cometer una ruta absoluta: https://github.com/react-dnd/react-dnd/search?q=christrevino&unscoped_q=christrevino

yarn build
yarn run v1.15.2
$ tsc
error TS6053: File '/Users/christrevino/Workspace/oss/react-dnd/packages/core/react-dnd/src/index.ts' not found.


Found 1 error.

error Command failed with exit code 2.

sandorfr en 6 ago. 2019

Limpié mi repositorio y pude ejecutar la compilación a pesar del tsconfig.

Usando el enlace de hilo, puedo hacer que todo funcione, pero parece que los paquetes 9.3.5 publicados todavía no incluyen los archivos correctos.

sandorfr en 6 ago. 2019

Las compilaciones de CJS siempre estuvieron destinadas a generarse dinámicamente, por lo que no me preocupan demasiado las rutas absolutas en ellas. En yarn install deberían regenerarse de todos modos. La única razón por la que no están en .gitignore fue porque Lerna no pudo detectarlos si lo estuvieran.

darthtrevino en 6 ago. 2019

@sandorfr ¿qué tipo de errores ves después de que se completa la compilación?

darthtrevino en 6 ago. 2019

Veo que falta el campo de mecanografía en el CJS; haré otro lanzamiento para eso

darthtrevino en 6 ago. 2019

👍1

Solo el error anterior https://github.com/react-dnd/react-dnd/issues/1468#issuecomment -518488026, pero se resolvió limpiando mi repositorio. Supongo que la instalación de hilo que hice y luego la arreglé.

El único problema que queda es que el 9.3.5 que publicó no parece incluir los cambios cuando inspecciona el tarball y aún obtiene las importaciones incorrectas.

Si miro mis paquetes construidos localmente, están bien.

sandorfr en 6 ago. 2019

Estoy eliminando las URL absolutas del script create_packages, debería estar activo en un minuto

darthtrevino en 6 ago. 2019

🚀1 ❤1

@sandorfr Los paquetes CJS se están publicando ahora en 9.3.6

darthtrevino en 6 ago. 2019

~~Hmm, no creo que se esté ejecutando el script de reemplazo cuando se activa la publicación.~~

El contenido de la instalación de npm se ve bien, debo haber leído mal algo allí.

darthtrevino en 6 ago. 2019

Ok probándolo ahora :)

sandorfr en 6 ago. 2019

siguen siendo los archivos incorrectos ...

sandorfr en 6 ago. 2019

Lerna debe estar colocando eslabones de hilo o algo así.
Editar - sí, instalar con npm en otro directorio reproduce esto - cortaré otro ..

darthtrevino en 6 ago. 2019

Gracias por tu paciencia, me disculpo por cortar un montón de parches seguidos. Esos probablemente deberían haber sido prelanzamientos.

darthtrevino en 6 ago. 2019

🚀1

Gracias por tu paciencia, me disculpo por cortar un montón de parches seguidos. Esos probablemente deberían haber sido prelanzamientos.

Gracias por la reactividad :) Sé lo doloroso que es este tipo de problemas. Entonces puedo relacionarme :)

sandorfr en 6 ago. 2019

la versión correcta será la 9.3.8?

sandorfr en 6 ago. 2019

9.3.9 con suerte - 9.3.8 no tiene directorios lib /. Algo se modificó con la forma en que se ejecutaba el script prepublishOnly.

darthtrevino en 6 ago. 2019

9.3.9 se ve bien por mi parte

darthtrevino en 6 ago. 2019

🚀1

@martinschayna , ¿funcionó el segundo recorte? Probé un par de cosas que obtengo No puedo encontrar dnd-core o

@sandorfr sí, funciona con versiones anteriores de [email protected] y [email protected] instaladas. Todavía no lo he probado con versiones más nuevas, pero estoy deseando eliminar mi truco feo de la configuración de babel: mild_smiling_face:

martinschayna en 6 ago. 2019

9.3.9 se ve bien por mi parte

Se ve bien 💃. Definitivamente lo sabré una vez que se complete el CI :)

sandorfr en 6 ago. 2019

Estoy fuera hasta el 20, siéntete libre de volver a abrir esto si el problema persiste. ¡Gracias!

darthtrevino en 6 ago. 2019

🚀2 👍1

¿Puedes publicar en npm? El último disponible es 9.3.4 a partir de hoy https://www.npmjs.com/package/react-dnd

fabien-h en 22 ago. 2019

¿Puedes publicar en npm? El último disponible es 9.3.4 a partir de hoy https://www.npmjs.com/package/react-dnd

la solución en cuestión solo se aplica / afecta a las versiones de cjs: https://www.npmjs.com/package/react-dnd-cjs

sandorfr en 22 ago. 2019

¿Fue útil esta página

0 / 5 - 0 calificaciones

Temas relacionados

react-dnd puede llamar a un componente desmontado causando un error no detectado: no se pudo encontrar un targetId válido

mx2323 · 3Comentarios

Error no detectado: no se pueden tener dos backends HTML5 al mismo tiempo.

antoineBernard · 3Comentarios

HTML5Backend deja de arrastrar cuando hay elementos en el DOM que aparecen/desaparecen en el evento de arrastre: CHROME

vickyvxr · 3Comentarios

Usando DragSource y DropTarget en los mismos componentes pero sin respuesta de DropTarget

dant00ine · 3Comentarios

Corrija las fuentes de arrastre anidadas y cómo funcionan con canDrag

gaearon · 4Comentarios