I'm using this Boilerplate with React, Webpack, Babel & Hot-Reloading. Everything was working fine, until I tried adding Chakra-UI
Now, loading fails because hot-reloading can't import one of Chakra-UI's imports.
SyntaxError: Unexpected token '['. Expected opening '{' at the start of a class body. is the error I am getting.
I believe this is the file causing the error:
import { createMotionComponent } from '../../motion/index.js';
import { Drag } from '../../motion/features/drag.js';
import { Gestures } from '../../motion/features/gestures.js';
import { Exit } from '../../motion/features/exit.js';
import { Animation } from '../../motion/features/animation.js';
import { AnimateLayout } from '../../motion/features/layout/Animate.js';
import { MeasureLayout } from '../../motion/features/layout/Measure.js';
import { createDomMotionConfig } from './utils/create-config.js';
import { createMotionProxy } from './motion-proxy.js';
var allMotionFeatures = [
MeasureLayout,
Animation,
Drag,
Gestures,
Exit,
AnimateLayout,
];
/**
* HTML & SVG components, optimised for use with gestures and animation. These can be used as
* drop-in replacements for any HTML & SVG component, all CSS & SVG properties are supported.
*
* @public
*/
var motion = /*@__PURE__*/ createMotionProxy(allMotionFeatures);
/**
* Create a DOM `motion` component with the provided string. This is primarily intended
* as a full alternative to `motion` for consumers who have to support environments that don't
* support `Proxy`.
*
* ```javascript
* import { createDomMotionComponent } from "framer-motion"
*
* const motion = {
* div: createDomMotionComponent('div')
* }
* ```
*
* @public
*/
function createDomMotionComponent(key) {
return createMotionComponent(createDomMotionConfig(allMotionFeatures, key, false));
}
export { createDomMotionComponent, motion };
However, when I remove the "HotModuleReplacementPlugin" from the Webpack config in order to disable hot-reloading, everything works just fine. Is there something I am missing (maybe a babel plugin that is doing something strange?) or have I come across a bug in react-hot-loader?
