I'm creating a react project with this command npx react-native init projectName,
It does create the project, however App.js have typeScript code in it, it compiles just fine but VScode keeps throwing an error about annotations being a part of .ts file only.
IK typescript, so if react does create typeScript code then why is the extension .js.
Is there something that I'm doing wrong?
One more thing I'd like to add, If I manually change App.js to App.tsx the error does go away and it still works fine, but I don't think that's the right way to go, and I don't intend to turn off javaScript checking is vs Code
It's not typescript, but flow. More info: https://github.com/facebook/react-native/issues/29123
As mentioned in the other answer, what you are seeing in App.js is not TypeScript code. It is Flow, facebook's own static type checker for JavaScript.
If you want to use TypeScript then create project using this template:
npx react-native init MyApp --template react-native-template-typescript
You can find more details about TypeScript integration in React Native here:
https://reactnative.dev/docs/typescript
Related
Hey I am recently working with react and typescript together and I wanted to have some country logos, I installed this package which seems to be the most popular one for reactjs, the package called react country flag, and I cannot use it maybe with ts? is that the case?
my error is the one in the image below.
The package does not come with typescript types, do this in the terminal. This will try to download the types for that package if they exist
npm i --save-dev #types/react-country-flag
If it still doesn't exist, add
//#ts-ignore above the import line, like this:
//#ts-ignore
import ReactCountryFlag from "react-country-flag"
That will ignore the error you are having
I'm using create-react-app with typescript. I don't want typescript to stop the javascript execution when a typescript error is caught, I want to get warned in the console but I don't the UI to be interrupted.
is it possible to configure tsconfig in such a way?
To do this with create-react-app, you can edit your .env file to have the following:
TSC_COMPILE_ON_ERROR=true
For information on advanced configuration of create-react app, see this page.
Hi Guys I'm trying to export a component with bit.dev but after several attempts I always get this error on the preview of the component and importing the component I always get error.
Module not found: Can't resolve 'react/jsx-runtime' in '/capsule/node_modules/#bit/giovannigiampaolo.testCollection.button/dist'
Can someone help me?
If this issue is in the typescript project then, we need to add tsconfig.json to the project.
Since we cannot follow the default folder structure of NodeJS, we shall need to create an environment for the workspace.
Reference Link: Bit Envs Overview
We can try to implement the way documented above.
Using this I got configurations of typescript, webpack, and jest.
The typescript folder contained the tsconfig.json file and we can edit it to our requirements.
Updating your React to the latest version will solve the issue; did it for me. Just do:
yarn add react#latest
and you're good.
I feel like I was finally able to setup my expo monorepo using expo-yarn-workspaces until I encountered the following error:
Invariant Violation: Hooks can only be called inside the body of a function component. (https:fb.me/react-invalid-hook-call)
Has anyone successfully created an expo monorepo working with react hooks?
I should also mention that the expo app was working perfectly with no-hoist until I needed to include other packages from the monorepo into it. So it seems the issue is now how yarn-expo-workspaces is not compatible with hooks, or am I missing something?
I'm writing react-native application and using npm module #waves/signature-adapter. When I make import { Seed } from '#waves/signature-generator'; compiler returns an error undefined is not a constructor (evaluating 'new __1.Base58('senderPublicKey')'). At first I thought the way I imported the lib was wrong but then I tried to do the same for new react application (not react-native) and it is imported and works with no errors.
The module is written in typescript but I'm not sure it really matters cause my app uses lots of other modules written in typescript. I try to understand what's wrong cause I have same-same code in both apps, but it gives the error in react-native.
The reason was the lib used native node.js modules which react-native didn't support. I had to make a patch using patch-package to solve the problem.