React-dnd: Violação invariável: contexto de arrastar e soltar esperado ao implantar no servidor

Criado em 31 jul. 2019 · 11Comentários · Fonte: react-dnd/react-dnd

Meu aplicativo está funcionando bem em meu ambiente local, mas quando implanto no servidor, o console imprime o erro: 'Violação invariável: Esperado localizar contexto de arrastar e soltar' ao implantar no servidor.
Não tenho ideia do que está errado. Você poderia me dar alguns conselhos sobre o que pode ser a causa raiz?
Minha versão de nó local é 8.11.3. E eu uso 8.11.3 no servidor para construir e um servidor expresso para servir os arquivos estáticos no ambiente de nó de nuvem padrão (v6.7.0).
Estou usando:
"react-dnd": "^ 9.0.1"
"react-dnd-html5-backend": "^ 9.0.0"
"react-dnd-touch-backend": "^ 9.0.2"

Fonte

TingOOOgniT

Comentários muito úteis

você deve embrulhar o componente do arquivo de teste assim:

<DndProvider backend={HTML5Backend}> <Component /> </DndProvider>

roweldev-jukin em 24 set. 2019

👍23 🚀2

Todos 11 comentários

Eu atualizei meus pacotes para o mais recente e o erro ocorre em meu ambiente local.

TingOOOgniT em 1 ago. 2019

É porque eu tenho um ^ e uso yarn em local, mas npm na nuvem para construir, então tenho versões de pacote diferentes em local e dev.
E quando eu uso 9.3.3 e 9.3.2, recebo o mesmo erro: 'Invariant Violation: Expected drag drop context find. Perdi o contexto.
E 9.2.1 está bom.

TingOOOgniT em 1 ago. 2019

+1 eu estou entendendo isso também

O ambiente se parece com:

"react": "^16.8.6", "react-dnd": "^9.3.4", "react-dnd-html5-backend": "^9.3.4", "react-dom": "^16.8.6",

coxrichuk em 12 ago. 2019

👍1

Isso provavelmente significa que você tem DndProvider envolvendo um componente muito baixo em sua árvore de componentes.

sa-scole em 16 ago. 2019

👍1

Você resolveu isso? Eu tive o mesmo problema e descobri que tinha várias bibliotecas react-dnd de diferentes versões empacotadas em meu aplicativo. Espero que isso ajude alguém.

jamiewinder em 21 ago. 2019

Eu também estou enfrentando o mesmo problema. Alguém encontrou a solução, por favor, compartilhe.

sauravgarg540 em 29 ago. 2019

Eu não estava exportando <DndProvider /> . Depois de fazer isso, tudo funcionou bem.

binarybaba em 16 set. 2019

você deve embrulhar o componente do arquivo de teste assim:

<DndProvider backend={HTML5Backend}> <Component /> </DndProvider>

roweldev-jukin em 24 set. 2019

👍23 🚀2

você deve embrulhar o componente do arquivo de teste assim:
<DndProvider backend={HTML5Backend}> <Component /> </DndProvider>

Eu realmente gostaria que essas informações estivessem disponíveis nesta página http://react-dnd.github.io/react-dnd/docs/overview.

Caso contrário, os usuários terão que percorrer toda uma implementação do tabuleiro de xadrez para encontrar isso.

Foxhoundn em 6 nov. 2019

👍12 🎉5 ❤1

Estou recebendo o erro Expected drag drop context também. Para mim, isso funciona apenas se DndProvider for o nó pai imediato do componente que usa useDrag . Ele funciona com uma versão mais antiga (9.0.0). No entanto, a dica