Expo break react-styleguidist babel configuration

Expo SDK
1

Please provide the following:

  1. SDK Version: 36
  2. Platforms(Android/iOS/web/all): all

I have the following error when I try to start my react-styleguidist documentation:

./node_modules/react-native-gesture-handler/touchables/TouchableHighlight.js 10:22
Module parse failed: Unexpected token (10:22)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|  */
| export default class TouchableHighlight extends Component {
>   static defaultProps = {
|     ...GenericTouchable.defaultProps,
|     activeOpacity: 0.85,
 @ ./node_modules/react-native-gesture-handler/touchables/index.js 6:0-69 6:0-69
 @ ./node_modules/react-native-gesture-handler/index.js

My webpack.config.js look like this:

const createExpoWebpackConfigAsync = require('@expo/webpack-config');
module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(env, argv);
  return config;
};

My babel.config.js look like this:

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    env: {
      development: {
        plugins: [
          '@babel/plugin-transform-react-jsx-source',
        ],
      },
    },
  };
};

Reproduction:

git clone https://github.com/kopax/expo-bug-reports.git
cd expo-bug-reports
git checkout react-styleguidist
npm i
npm run styleguide

It work fine in expo, and react-styleguidist use babel-loader to load from babel.config.js, what in expo can cause third party app to fail configure babel properly?

2

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.