How to use mocha with webpack, babel and react

Question

I'd like to start doing TDD (via CLI) with a codebase that's using react jsx and webpack with the babel-loader to bundle.

Jest is too slow to use, and it's difficult to use nodeunit, mocha, or jasmine through the CLI since I would need to transpile the jsx to js first.

I really liked the solution i saw here (use the --compile option of mocha to pass code through babel, shown at 1:49) but it doesn't quite work the same as shown in the video. My canary test is failing at the import keyword, so clearly the babel is failing to transpile ES6, let alone jsx.

Does anyone know how to use the --compile option for mocha to pass each jsx file and its dependencies through babel transpiler successfully? Or another solution like jest but vastly more performant?

Answer 1

So the reason the code in the video didn't work anymore is because babel has refactored register into its own module. Instead of using babel/register use babel-register (you'll have to install this package separately).