unable to create new app from template

[xfyre]

Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior:

I'm running:

react-native init AwesomeApp --template ui-kitten

as described on the project page. I'm receiving the following error:

✖ Downloading template
error Error: Command failed: npm install --save --save-exact ui-kitten
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/ui-kitten - Not found
npm ERR! 404 
npm ERR! 404  'ui-kitten@latest' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

Expected behavior:

The command should create a new app skeleton from template.

Steps to reproduce:

Run the command as described above.

Related code:

Not applicable.

Other information:

OS, device, package version

Mac OS X 10.14.6
npm 6.11.3
react-native 0.60.5

Note: the issue is reproducible with with and without yarn installed.

[artyorsh]

Thanks for report. This is already known issue #618 We got this fixed in #623 and it will be publically available soon in a stable release

[artyorsh]

@xfyre for now, to setup new project, please follow this guide

[xfyre]

@artyorsh Thanks - I have already done that. But I have troubles figuring if that's possible to transparently migrate from NativeBase (in particular, TopNavigation component appears unstyled even when put inside ApplicationProvider/Layout).

That's why I wanted to take a look at some minimalistic example to understand what else do I need to do to make it work.

[artyorsh]

@xfyre It should work if you correctly configured ApplicationProvider. Please create a snack or share some code snippets here if it still actual

[xfyre]

@artyorsh From the documentation my understanding is that plugging in theme & mappings is enough to make it work. It was done as described (I have inspected RN hierarchy and everything seems to be in place), however it still doesn't work.

Basically it's something like this:

(defonce eva-design (js/require "@eva-design/eva"))
(defonce ui-kitten (js/require "react-native-ui-kitten"))

(defonce eva-mapping (oget eva-design :mapping))
(defonce eva-light-theme (oget eva-design :light))
(defonce application-provider (r/adapt-react-class (oget ui-kitten :ApplicationProvider)))
(defonce layout (r/adapt-react-class (oget ui-kitten :Layout)))
(defonce top-navigation (r/adapt-react-class (oget ui-kitten :TopNavigation)))

[application-provider
  {:theme eva-light-theme :mapping eva-mapping}
  [layout [top-navigation {:title "something"}]]

Layout component is also wrapped by several layers of react-navigation components.

Since I'm using ClojureScript - it's quite difficult to provide an example that would work for others, and it might be that the way Reagent wraps around React - interferes with UIKitten somehow.

I might try to re-create it outside of the current project in a minimalistic way to find out what's wrong.

[artyorsh]

@xfyre Actually I have no idea how does Clojure/Reagent work, but we provide styles to components with React.Context (this is why you need ApplicationProvider as root component). Can it be so that Reagent is not able to work with it?

[xfyre]

@artyorsh I dug into this briefly and found https://github.com/reagent-project/reagent/issues/330 (tl;dr - it claims that React context is supported, but somehow the issue is still open).

I'll check this further, thanks for the pointer!

[artyorsh]

@xfyre Please notify if you will be able or not to make it work :)

[xfyre]

@artyorsh I've checked and from the way it looks - context is successfully passed to the TopNavigation component: https://take.ms/uu2tu.

UPD: in fact, theme is working to some extent (colors seem to be correct when switching to Dark theme). But font size and styling is very different from what's seen in the Kitten Tricks app. Apparently I'm missing something else here?

[artyorsh]

@xfyre we use custom fonts in Kitten Tricks (OpenSans). You can try using custom fonts too, but it works properly in React with system fonts on both platforms (Roboto for Android and San Francisco for iOS)