expo / snack

Expo Snack lets you run Expo in the browser.
https://snack.expo.dev
MIT License
372 stars 111 forks source link

Snackager having issues with TypeScript type imports #383

Open wKovacs64 opened 1 year ago

wKovacs64 commented 1 year ago

Summary

I was about to release a new version of a library I maintain after converting it to TypeScript, but I noticed it no longer works in Snack (but works fine in a local app).

Snackager error (truncated):

package.json (3:5)Failed to resolve dependency 'react-native-responsive-image-view@0.0.0-5ceb1aa9' (Module build failed (from ../../../../../../../node_modules/babel-loader/lib/index.js):

SyntaxError: /tmp/snackager/snackager/buildStatus/1/react-native-responsive-image-view@0.0.0-5ceb1aa9-ios,android,web/package/src/index.tsx: Unexpected token, expected "," (4:7)

  2 | import {
  3 |   useResponsiveImageView,
> 4 |   type ResponsiveImageViewProps,
    |        ^
  5 | } from './useResponsiveImageView';
  6 |
  7 | function defaultOnLoad() {}

I'm using react-native-builder-bob so my package.json looks like so:

  "main": "dist/commonjs/index.js",
  "module": "dist/module/index.js",
  "types": "dist/typescript/src/index.d.ts",
  "react-native": "src/index.tsx",
  "source": "src/index.tsx",

The react-native-builder-bob docs state the following:

It's usually good to point to your source code with the react-native field to make debugging easier. Metro already supports compiling a lot of new syntaxes including JSX, Flow and TypeScript and it will use this field if present.

But as I understand it, Snackager is not Metro. I guess it's reading the react-native field and struggling with the fact that it's TS? I did see previous issue #319 but it's closed as fixed in #327.

What platform(s) does this occur on?

Android, iOS, Web

SDK Version

47

Reproducible demo or steps to reproduce from a blank project

https://snack.expo.dev/@wkovacs64/rnriv-typescript