Import from @realm/react reported as error because current file is CommonJS

[milos201]

How frequently does the bug occur?

Always

Description

The following import is reported as error when importing anything from @realm/react in a brand new React Native TypeScript project:

import { useRealm, useQuery } from '@realm/react'
                                    ~~~~~~~~~~~~

Message:

The current file is a CommonJS module whose imports will produce 'require' calls; however, the referenced file is an ECMAScript module and cannot be imported with 'require'. Consider writing a dynamic 'import("@realm/react")' call instead. To convert this file to an ECMAScript module, change its file extension to '.mts', or add the field "type": "module" to 'package.json' .ts(1479)

Stacktrace & log output

No response

Can you reproduce the bug?

Always

Reproduction Steps

1. npx react-native@latest init AwesomeProject 1.5 cd ./AwesomeProject
2. yarn add realm @realm/react
3. Import useRealm from @realm/react anywhere

Version

0.6.2

What services are you using?

Local Database only

Are you using encryption?

No

Platform OS and version(s)

macOS Sonoma 14.1 - Visual Studio Code v1.87.1

Build environment

No response

Cocoapods version

No response

[sync-by-unito[bot]]

➤ PM Bot commented:

Jira ticket: RJS-2756

[kneth]

@milos201 I am not able to reproduce it. In which file did you add import { useRealm, useQuery } from '@realm/react'? The error message indicates that you didn't add the import to a .tsx file.

[milos201]

@milos201 I am not able to reproduce it. In which file did you add import { useRealm, useQuery } from '@realm/react'? The error message indicates that you didn't add the import to a .tsx file.

That's correct. Error comes from typescript compiler with default TS configuration when creating react native app.

[nirinchev]

Per the error message, you should add "type": "module" to your package.json or employ some of the other suggestions to use ES6 modules.

[github-actions[bot]]

This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take action. Please reach out if you have or find the answers we need so that we can investigate further.