7

Suffering from a weird error and currently can't get through. So When I run tests console throws:

/var/www/html/node_modules/react-dnd/dist/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){export * from './core/index.js';
                                                                                  ^^^^^^


SyntaxError: Unexpected token 'export'

I Googled. People were discussing and saying module mappers should be added, so I added this code inside jest config:

'^react-dnd$': '<rootDir>/node_modules/react-dnd/dist/cjs',
'^react-dnd-html5-backend$': '<rootDir>/node_modules/react-dnd-html5-backend/dist/cjs',
'^dnd-core$': '<rootDir>/node_modules/dnd-core/dist/cjs',

Another error thrown:

 Please check your configuration for these entries:
    {
      "moduleNameMapper": {
        "/^react-dnd$/": "react-dnd/dist/cjs"
      },
      "resolver": undefined
    }

If anyone has solved this with react-dnd please help me out! :))

Rollin
  • 304
  • 4
  • 13
  • Can you include the full `moduleNameMapper` section of your jest config? Are you using Babel? Some from [this issue](https://github.com/react-dnd/react-dnd/issues/3443) got around this by ignoring DND files from babel transformation via `transformIgnorePatterns` – Tyler Dane May 11 '22 at 14:33
  • See the last answer here, that is your go to solution, please accept it if it worked for you. – Foxhoundn Feb 23 '23 at 12:07

2 Answers2

2

added this to package.json

"jest": { "transformIgnorePatterns": [ "/node_modules/(?!react-dnd|core-dnd|@react-dnd|dnd-core|react-dnd-html5-backend)" ] }

Bavin Edwards
  • 29
  • 2
  • 1
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jun 19 '22 at 11:18
  • This does not help, I doubt it ever did. – Foxhoundn Feb 23 '23 at 12:03
1

This worked for me.

Add the common javascript libraries to your project I'm using yarn

yarn add react-dnd-cjs

yarn add react-dnd-html5-backend-cjs

Then in your package.json add...

"jest": { "moduleNameMapper": { "react-dnd": "react-dnd-cjs", "react-dnd-html5-backend": "react-dnd-html5-backend-cjs", "dnd-core": "dnd-core-cjs" }

had some issues building in azure even though this worked locally so just downgrading to 15.1.2 fir now and that doesn't have this issue

user2344305
  • 11
  • 4
  • 1
    Amazing, this solved it! I assume it makes sense since `react-dnd` dists no longer have any `cjs` folder and probably were moved to their respective packages. It's incredible to be solving issues like this 10 years into modern javascript, we have learned NOTHING – Foxhoundn Feb 23 '23 at 12:06