How to using "react-native-size-matters" for tokens (size)?

[thienvu23]

Current Behavior

Tamagui Warning [001]: Skipping loading ./tokens due to error bundling.
transform[stdout]: - message: (0 , import_react_native_size_matters.ms) is not a function
transform[stdout]: - for more info see: https://tamagui.dev/docs/intro/errors#warning-001
transform[stdout]: - set TAMAGUI_SHOW_FULL_BUNDLE_ERRORS=1 to see stack trac

Tamagui Warning [001]: Skipping loading /Users/thien/Documents/test-tamagui/tamagui.config.ts due to error bundling.
transform[stdout]: - message: Expected tokens for "size" in displayName, _isProxyWorm, color
transform[stdout]: - for more info see: https://tamagui.dev/docs/intro/errors#warning-001
transform[stdout]: - set TAMAGUI_SHOW_FULL_BUNDLE_ERRORS=1 to see stack trace

Expected Behavior

No response

Tamagui Version

v1.76.0

Platform (Expo MOBILE)

import { ms, vs } from "react-native-size-matters";
import { createTokens } from "tamagui";

export const size = {
  $0: 0,
  // Width
  "$0.25": ms(2),
  "$0.5": ms(4),
  "$0.75": ms(8),
  $1: ms(20),
  "$1.5": ms(24),
  $2: ms(28),
  "$2.5": ms(32),
  $3: ms(36),
  "$3.5": ms(40),
  $4: ms(44),
  $true: ms(44),
  "$4.5": ms(48),
  $5: ms(52),
  $6: ms(64),
  $7: ms(74),
  $8: ms(84),
  $9: ms(94),
  $10: ms(104),
  $11: ms(124),
  $12: ms(144),
  $13: ms(164),
  $14: ms(184),
  $15: ms(204),
  $16: ms(224),
  $17: ms(224),
  $18: ms(244),
  $19: ms(264),
  $20: ms(284),
}
...

export const tokens = createTokens({
  size,
  space,
  zIndex,
  color,
  radius,
});

Reproduction

Using react-native-size-matters for tamagui.config
https://github.com/thienvu23/tamagui-reproduction

System Info

No response

[thienvu23]

so it can not auto-generate the .tamagui/tamagui.config.json file
Currently pressTheme not working for me. I think the reason is there
Because when I use @tamagui/config/v2-native everything works fine.

[thienvu23]

@natew I don't know how to fix this. It actually affects my pressTheme animation if I use react-native-size-matters in my project.

Everything is fine if I use pixels. But I would like to use dynamic size for my project

This is really annoying.

[thienvu23]

@natew it's good if you keep an eye on this. Things are bad when this affects the tap effect. It's bad when the user presses without a response from the UI.
I spent hours debugging with debug="verbose". All logs seem to be fine to me. But my pressStyle still doesn't work. Can you tell me a reason you can think of? Or another solution for me?

[natew]

Needs a reproduction so I can take a look

[thienvu23]

@natew I will try to create a mini-project for that. I just realized that all tokens using react-native-size-matters are broken in the release (Using Eas Expo build). They can work on dev environments, it's just that press themes don't work.

[thienvu23]

I see some logs when I use eas:update cli. Will this affect my release tokens? I think this also happens when I use eas:build

[thienvu23]

@natew I just realized I must set disableExtraction: true to resolve the problem in release mode. But it is still happening in the dev mode. The press theme does not work in dev mode. You can use this repo.

[SamiAljord]

Life saver!!!