It feels like a basic question but whenever I am trying to create a react native project using the command provided here It is always creating a typescript project for me instead of blank javascript project. How do I force it to create a blank javascript project what I am doing wrong?
Here is screenshot of App.js of the project that is being created
I have also tried making a project using native-base blank template but it is throwing an error
npx react-native init MyApp --template #native-base/react-native-template
React Native defaults new applications to TypeScript, but JavaScript may still be used. Files with a .jsx extension are treated as JavaScript instead of TypeScript, and will not be typechecked. JavaScript modules may still be imported by TypeScript modules, along with the reverse.
https://reactnative.dev/docs/typescript#using-javascript-instead-of-typescript
Related
I just tried to create my own custom component for React Native, i just tried it directly inside vscode editor and it's works.
but when i install it from npm, my properties not showing up
how to make it works like 1st pick above?
here's my source code on github
my question might be a little bit silly or ambiguous since I am fairly new to react native.
I'm trying to use the following repository for my react-native project https://github.com/smekalka/react-native-universal-pedometer. I have noticed that the repo is implemented in .java with platform folder unlike the regular .js or .ts files I used to see. Is this repository considered native module as react native doc describe?
Or in general how I can tell the whatever lib I am using is a native module.
The project is previously tested are under the support of expo-cli. I experienced the error null is not n object while using this repo. If so, I am probably going to eject the expo-cli and rewrite my code so I can use and even create own native-module for full control, some core implementations that written in other languages or expo-cli does not support.
Yes, the android and ios directories in the repository contain the 'native' code used to implement the platform-specific hooks that the Javascript will be able to pick up. Expo is not able to use these native modules or native code so your assumption is correct; you will need to eject your app in order to use this module.
If your app is below version 0.60 of React Native, after installing the module you will need to run react-native link react-native-universal-pedometer to link the native code to the Javascript runtime. If you're above 0.60, it will link automatically when installed.
I am new to application development with React-native. While creating project with the command react-native init appname the index.js file is also created inside the project folder. Today, I have learned that there is a better way than installing android emulator to test react-native projects which is Expo. To create expo projects I need to create react-native project with create-react-native-app appname command. However, the index.js file is not created while creating project with this way. Even though, I manually created the index.js file, it does not work as it should.
One more question: What is aim of App.js and index.js?
React Native: (react-native init)
A little bit of history. In earlier versions of React Native, separate index.js files were required for iOS and Android. App.js was meant to contain the top level cross platform code for your app. Then index.ios.js and index.android.js would import the cross platform code from App.js and register/link it with the underlying native modules. That allowed you to place top-level cross platform code in one file while placing top-level platform specific code in other files. The index.*.js files were the connectors that wired up the Javascript to native Android or iOS code.
As React Native evolved to remove the platform specific index files, they kept the paradigm of having the top-level Javascript in App.js and using index.js to wire that code to the native modules.
Bottom Line
As a practical matter, don't touch index.js. Make your top-level modifications in App.js.
Expo: (create-react-native-app)
Expo operates a little differently than baseline React Native. You will notice that an Expo project does not contain the ios or android directories. That is because there is no native code associated with an Expo project. All of the native code is contained in the Expo SDK. Since there is no native code to wire up to your Javascript, you do not need an index.js file.
Bottom Line
You should not need an index.js file in an Expo project. If your Expo project is not working, there is likely another problem that needs to be resolved.
I want to allow for my React Native application to use Decorators, but how do I achieve this?
In React, it's pretty simple:
I ran yarn run eject
I modified webpack.config.*.js and added plugins: ['transform-decorators-legacy']
How do I achieve something similar with react-native? I instantiated my project via the react-native CLI - react-native init AwesomeApp.
However, the eject command doesn't exist.
When you're developing an application using only React Native CLI, you don't have access to configuration files such as webpack.config.js, or an eject command.
But you can add decorators support through the same Babel plugin, just by modifying .babelrc file. Follow the steps below:
Install the plugin to your project (as a dev dependency): yarn add --dev babel-plugin-transform-decorators-legacy;
Declare the plugin in your .babelrc file: "plugins": ["transform-decorators-legacy"];
Now, next time you start the packager (or bundle the sources), React Native will be able to interpret the decorators you've used in your JavaScript files.
The example given in this article shows exactly what I have described above.
Also, you might take a look at Haul, a tool for creating React Native apps using webpack.
Good luck!
Im having a bit of an issue after upgrading to React Native 0.30. Using mocha, and babel I transpile the react native source before test run. I'm now seeing issues where modules cannot be found.
Here's an example:
Error: Cannot find module 'AssetRegistry'
The corresponding file can be found here https://github.com/facebook/react-native/blob/master/Libraries/Image/AssetSourceResolver.js#L21. It looks as if babel cannot locate the AssetRegistry file that is local in this directory.
Ok so it turns out that react-native-maps was calling an internal react-native library. react-native-mock has most of the internals mocked for react native however the internal library for the Image utility was not mocked.
I just used mockery to mock the library and all seems to work now.