In theory, it seems you should be able to use Ignite and its boilerplates with create-react-native-app by executing:
ignite attach
ignite add ir-boilerplate
And then copying the boilerplate application code into the project directory.
Now that create-react-native-app is tightly coupled with Expo, this doesn't work as expected. The Ignite code causes all kinds of errors within the Expo framework. From my reading, it seems the Ignite dependencies conflict with what is provided by Expo.
One lone soldier hacked together a solution to the Expo conflicts, but this was done just for Expo and not create-react-native-app. Also I'd obviously prefer a more supported solution.
So... has anyone gotten the Ignite boilerplate running within the new create-react-native-app which integrates with Expo?
If that isn't feasible, what would you recommend? I think it's safe to assume that Ignite will have to be updated to support Expo, especially now that it is ingrained in create-react-native-app. If I develop using Ignite today, will I be able to migrate my work into the create-react-native-app framework when Ignite supports it?
Thanks!
$ ignite new MyLatestCreation -b ignite-expo
(according to GitHub thread: https://github.com/infinitered/ignite/issues/1008)
Hi, mate!
I'd recommend you this boilerplate to integrate expo with ignite: https://github.com/skellock/expo-with-ignite
For easy reference: this command will get you a ignite-expo boiler template
ignite new MyLatestCreation -b ignite-expo
report any issues here
yes ignite it works with expo for react native apps you should use this command line
npx ignite-cli new PizzaApp -b bowser --expo to run new project using ignite browser
for more information and how to work with it you can check my github readme for my first project using ignite [ignite]https://github.com/HAFDIAHMED/Ignite_first_app
Related
Has anyone been able to get React-Native 0.7, React-Native-Web and React-Navigation/Stack 6.2.3 to work on web? I have a small app working on iOS and Android which I am trying to enable on web too. iOS and Android portion work fine and using metro.
However, webpack build continues to error out with "Module parse failed: Unexpected token" on the NavigationContainer.
I tried searching both react-native-web and react-navigation Issues on their respective GitHub Repositories. However, could not find something to solve my issue. Also tried modifying webpack.config with several different configurations/loaders.
Used links below as a reference too:
https://arry.medium.com/how-to-add-react-native-web-to-an-existing-react-native-project-eb98c952c12f
https://gist.github.com/skabbes/0bfa0a969aac8ec13f716dda1ad2ab43
Yes, it happens that I maintain a library that does just that: creates a bare React Native app that also runs on the web: 🌒 Luna - https://github.com/criszz77/luna
Here is the live example: https://criszz77.github.io/luna/
You can find more on the wiki page about how it's implemented and you can also implement it by yourself: https://github.com/criszz77/luna/wiki
By using react-scripts, you don't have to handle webpack, babel and other hard configs by yourself.
It currently doesn't run on 0.7 (didn't have time to make the update), but it's in plan to support all the latest versions of course ASAP.
EDIT: Updated to 0.70.3 🎉
When I start my project using command expo start , Expo is starting the Metro bundler but not opening the developer tool. Also developer tool option is not available in commands menu.
I suppose there should be command option : 'd' which will launch the developer tool on the localhost:19002 but it's not coming for me.
Using expo cli version 5.4.4
Developer tools removal
Since the release of expo-cli#6.0.0 the expo team has decided to discontinue the Web UI they had put in place. You can find more details about this in this blog post.
All of the actions that could be done within the Web UI can be done within the command line interface. For example, one used to be able to change connection mode directly within the UI :
Now to start expo in --tunnel mode you would have to have ngrok installed on the new expo version npm i -g #expo/ngrok and to run npx expo start --tunnel. Details on the CLI can be found in the docs here.
Accessing the Developer tools anyway
If you still wish to use the developer tools web UI, there are two options :
Use an older version of the expo sdk (~44.0), to do so you could use expo-cli#5.0.2 which is linked to that sdk. However, it is not recommended to stay on older versions which will be discarded at some point.
Use your own Web UI. Here is the source code from expo's original Web UI which you can use a base. There are likely over repos out there which fit this purpose.
If you're using a library such as react-navigation or anything (or itself) the relies on reanimated you won't be able to use remote debugging. https://docs.expo.dev/versions/latest/sdk/reanimated/
After changing the expo sdk version from 45.0.4 to 44.0.6, I am able to see the Developer tools running on http://localhost:19002.
I'm trying to run my React Native app as a web site, on a browser.
I tried to go according to https://necolas.github.io/react-native-web/docs/installation/ but the instructions on the Setup page are not clear.
I found some (rare) posts regarding this, but they are old (2019) and seem to deviate from the info in the link above.
I use yarn android to run it on android.
So, I tried using yarn web. Didn't work.
Also, tried the basic react-native start followed by react-native run-web.
It seems the run-web command is not what is needed.
Any assist appreciated.
P.S. I initialized my project through Expo, as a Bare Workflow project. Hope that helps
According to the docs:
Expo for web can work on any React Native project. When you initialize a new project with a bare workflow template using expo-cli, if you run yarn web or npm run web it will start up expo-cli and open your project in a web browser.
The same guides for web from the managed workflow apply here.
So basically just initialise your project using expo init project-name and then select bare workflow or managed workflow. After that you can execute npm run web. It will open up the browser and run the web version of it. Keep in mind that there are some incompatibility of libraries from expo, for example, the Webview is incompatible on the web so you need to switch when on web to an iframe or so.
I created a project with create-react-native-app and I want to use jest-enzyme matchers, in their Readme there is a section on how to use it with create-react-app, but I did not find any info on how to use it with create-react-native-app.
To add these matchers all I need is to create a jest setup file, but create-react-native-app does not seen to allow for custom jest setup file.
So it's possible to a use a custom jest setup file without ejecting from create-react-native-app?
Also is there any way to add a jest setup file for create-react-native-app?
Maybe what you are looking for is http://airbnb.io/enzyme/docs/guides/react-native.html which explains as follows:
Unfortunately, React Native has many environmental dependencies that can be hard to simulate without a host device.
This can be difficult when you want your test suite to run with typical Continuous Integration servers such as Travis.
A pure JS mock of React Native exists and can solve this problem in the majority of use cases.
To install it, run:
npm i --save-dev react-native-mock
After adding that dependency you need to import the /mock within your tests you should good to go. Maybe I am out of context, you can update your problem and give us some extra context so we can craft a better answer.
Ultimately, there is something important to mention in this thread: https://github.com/airbnb/enzyme/issues/928 for the time of this post RN is in version 0.47 and working with react 16 alpha which is not a supported version for enzyme (the people at enzyme only work with rc versions) so if that is your case things looks quite difficult as there is no official support, however, last comment https://github.com/airbnb/enzyme/issues/928#issuecomment-324584942 offers unofficial alternatives
PD: make sure you follow the installation instructions here: http://airbnb.io/enzyme/docs/installation/index.html
will react native be supported by windows os?Or linux . I don't own a mac so i was wondering if facebook plans to release react native for windows or linux. i don't want to run virtual machine because it's too much of a hassle.
I had successfully run the react-native on windows with a few hack.
The gist is here gist
Windows support would be awesome but cannot promise an ETA. We'd be happy to review pull requests that will make the CLI work on Windows.
You could skip the CLI and start with the Sample app from examples, build it with Gradle and start the packager manually using node node_modules/react-native/packager/packager.js.
Discussion here: https://github.com/facebook/react-native/issues/2693
This is not official support but I figured out how to get things working on Windows in a way that allows you to use the react-native CLI as documented without having to modify the source code.
The main issue that I encountered was with the hardcoded references to sh in React Native's packager. I solved this by adding Cygwin's bin directory to my path. Others have provided solutions for this where they modify the source code to work on Windows but I'd prefer not to go that route in order to ease updating to newer versions of React Native.
The other two catches where having to enable virtualization in my BIOS in order to get HAXM support and having to load the debugger page manually.
I wrote up some notes on the complete process here and intend to keep this up to date with future release of React Native:
http://davidanderson.io/2015/10/18/a-step-by-step-guide-to-react-native-on-windows/