moti: Uncaught TypeError: createAnimatedComponent is not a function

@crutch12 thank you for the details

@rafakwolf

I’ve tested your configs with my project - and it works now!

Your babel.config.js works perfectly, it solves the problem:

// babel.config.js
module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      [
        'module-resolver',
        {
          extensions: ['.js', '.ts', '.tsx'],
          alias: {
            react: './node_modules/react',
            'react-native': './node_modules/react-native-web',
          },
        },
      ],
      '@babel/plugin-proposal-export-namespace-from',
      'react-native-reanimated/plugin'
    ]
  };
};

Here is the dramatic difference:

// babel.config.js
plugins: [
  [
    'module-resolver',
    {
      extensions: ['.js', '.ts', '.tsx'],
      alias: {
        'react': './node_modules/react',
        'react-native': './node_modules/react-native-web',
      },
    },
  ],
  '@babel/plugin-proposal-export-namespace-from',
  // ...
],

My previous babel.config.js:

// babel.config.js
module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      'react-native-reanimated/plugin',
    ],
  };
};

Here is my webpack.config.js (I didn’t change it, it works fine with new babel.config.js):

// webpack.config.js
const createExpoWebpackConfigAsync = require('@expo/webpack-config');

module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(
    {
      ...env,
      babel: {
        dangerouslyAddModulePathsToTranspile: ['moti', '@motify'],
      },
    },
    argv
  );

  config.resolve.alias['framer-motion'] = 'framer-motion/dist/framer-motion';

  return config;
}

So I think that adding react-native-reanimated in dangerouslyAddModulePathsToTranspile section is unnecessary

@crutch12 babel.config and webpack.config

@nandorojo @crutch12 I think I managed to make it work https://github.com/rafakwolf/expo-moti-web

Expo uses --legacy-peer-deps by default

Do you mean with expo install?