mgcrea / react-native-dnd

Modern and easy-to-use drag&drop library for react-native.
https://mgcrea.github.io/react-native-dnd/
MIT License
135 stars 12 forks source link

output has jsx syntax in minified js files #14

Closed kevinaltschuler closed 6 months ago

kevinaltschuler commented 7 months ago

the output files have JSX syntax in JS

this is not right (edit: maybe this may be the default for native and is ok for metro but not webpack unless you specify a new loader for it.)

for example in droppable.js it looks like this

return (<Animated.View ref={setNodeRef} onLayout={setNodeLayout} style={[style, animatedStyle]} {...otherProps}>
      {children}
    </Animated.View>);

but this has not been packed properly, unless you have a bundler that specifically handles this it gives an error such as

    ERROR in ./node_modules/@mgcrea/react-native-dnd/dist/components/Droppable.js 38:12
Module parse failed: Unexpected token (38:12)
File was processed with these loaders:
 * ./node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
|         return style;
|     }, [id, activeOpacity]);
>     return (<Animated.View ref={setNodeRef} onLayout={setNodeLayout} style={[style, animatedStyle]} {...otherProps}>
|       {children}
|     </Animated.View>);

other react native packages are packed as pure js and not jsx

EX from react-native-pager-view

  render() {
    return /*#__PURE__*/_react.default.createElement(_PagerViewNativeComponent.default, _extends({}, this.props, {
      ref: ref => {
        this.pagerView = ref;
      },
      style: this.props.style,
      layoutDirection: this.deducedLayoutDirection,
      onPageScroll: this._onPageScroll,
      onPageScrollStateChanged: this._onPageScrollStateChanged,
      onPageSelected: this._onPageSelected,
      onMoveShouldSetResponderCapture: this._onMoveShouldSetResponderCapture,
      children: (0, _utils.childrenWithOverriddenStyle)(this.props.children)
    }));
  }
kevinaltschuler commented 7 months ago

hol up im gonna just make a PR for this

kevinaltschuler commented 7 months ago

update, i realised that because im using expo go that it makes more sense for me to just use the web version @dnd-kit/core

mgcrea commented 6 months ago

Great you found a solution for expo/webpack, indeed for pure react-native apps we don't need to transform jsx as far as I know.