galio-org / galio-starter-kit Goto Github PK
View Code? Open in Web Editor NEWGalio's starter kit is an app you can use to see what you can create with our library
Home Page: https://galio.io
License: MIT License
Galio's starter kit is an app you can use to see what you can create with our library
Home Page: https://galio.io
License: MIT License
I apologise if this comes across as a silly question but I am new to react.
This being a starter kit and all, why does it use so many deprecated libraries?
npm WARN deprecated [email protected]: This version of React Navigation is no longer supported. Please upgrade to at least React Navigation 4.
npm WARN deprecated [email protected]: This version of React Navigation Stack is no longer supported. Please upgrade to 2.x.x. See https://reactnavigation.org/docs/4.x/upgrading-from-3.x#react-navigation-stack for instructions.
npm WARN deprecated [email protected]: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
The error messages clearly specify what new libraries to use. Should not a starter template, at least, not have deprecated versions?
(I am not trying to be lazy. I am sure I will update the code to suit my requirements. Just curious why this is how it is in the first place)
Happens when running on the android emulator as shown in the screenshot attached.
My_Env:
Node version: v16.14.2
Npm version: 8.5.0
Macbook pro M1 pro (Mac OS Monterey)
Also has anyone managed to run this on their end recently? (physical device, simulator or emulator)
As the SDK version seems pretty outdated (SDK 35) and wont run on my physical device due to that
In route.js
Dashboard: { screen: Dashboard, navigationOptions: { drawerLabel: 'Dashboard screen', drawerIcon: props => <MenuIcon name="flag" family="font-awesome" focused={props.focused} />, }, },
If I uncomment this the dashboard.js (component) lodign with error: Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check the render method of Dashboard
.
This error is located at:
in RCTView (at View.js:45)
in View (at Block.js:58)
in Block (at theme/index.js:33)
in _class (at Dashboard.js:124)
in RCTView (at View.js:45)
in View (at ScrollView.js:976)
in RCTScrollView (at ScrollView.js:1115)
in ScrollView (at Dashboard.js:162)
in RCTView (at View.js:45)
in View (at SafeAreaView.js:37)
in SafeAreaView (at Block.js:51)
in Block (at theme/index.js:33)
in _class (at Dashboard.js:154)
in Dashboard (at SceneView.js:9)
in SceneView (at DrawerView.js:87)
in RCTView (at View.js:45)
in View (at DrawerLayoutAndroid.android.js:198)
in AndroidDrawerLayout (at DrawerLayoutAndroid.android.js:217)
in DrawerLayoutAndroid (at DrawerView.js:84)
in DrawerView (at createNavigator.js:57)
in Navigator (at createNavigationContainer.js:376)
in NavigationContainer (at App.js:10)
in RCTView (at View.js:45)
in View (at App.js:8)
in App (at withExpoRoot.js:20)
in RootErrorBoundary (at withExpoRoot.js:19)
in ExpoRootComponent (at renderApplication.js:35)
in RCTView (at View.js:45)
in View (at AppContainer.js:98)
in RCTView (at View.js:45)
in View (at AppContainer.js:115)
in AppContainer (at renderApplication.js:34)
This error is located at:
in NavigationContainer (at App.js:10)
in RCTView (at View.js:45)
in View (at App.js:8)
in App (at withExpoRoot.js:20)
in RootErrorBoundary (at withExpoRoot.js:19)
in ExpoRootComponent (at renderApplication.js:35)
in RCTView (at View.js:45)
in View (at AppContainer.js:98)
in RCTView (at View.js:45)
in View (at AppContainer.js:115)
in AppContainer (at renderApplication.js:34)
fontFamily "Feather" is not a system font and has not been loaded through Font.loadAsync.
Hi,
I am trying to scroll the app in the Article Screen page, the scroll is not working. The screen is just stuck, scroll has no effect.
It's the exact clone of the app. No changes.
OS - Android
Device - Samsung Galaxy S7 Edge
Hi guys, i am getting the below error when i try to run it on the web
web Failed to compile.
/Applications/MAMP/htdocs/React Native/galio-starter-kit/App.js
SyntaxError: /Applications/MAMP/htdocs/React Native/galio-starter-kit/App.js: Unexpected token (8:6)
6 | render() {
7 | return (
8 | <View style={{ flex: 1 }}>
| ^
9 |
10 |
11 |
INFO
17:05
Compiling...
ERROR
17:05
web Failed to compile.
/Applications/MAMP/htdocs/React Native/galio-starter-kit/App.js
SyntaxError: /Applications/MAMP/htdocs/React Native/galio-starter-kit/App.js: Unexpected token (8:6)
6 | render() {
7 | return (
8 | <View style={{ flex: 1 }}>
| ^
9 |
10 |
11 |
INFO
17:05
Tunnel ready.
First running: npm install
Then
$ npm start
@galio-org/[email protected] start C:\Users\Iman\Documents\Github\galio-starter-kit
expo start
[01:31:20] Starting project at C:\Users\Iman\Documents\Github\galio-starter-kit
[01:31:21] Developer tools running on http://localhost:19002
[01:31:22] Some dependencies are incompatible with the installed expo package version:
[01:31:22] - react-native-svg - expected version: 9.9.5 - actual version installed: 9.13.6
[01:31:22] Your project may not work correctly until you install the correct versions of the packages.
To install the correct versions of these packages, please run: expo install [package-name ...]
[01:31:27] error Invalid regular expression: /(.\fixtures\.|node_modules[\]react[\]dist[\].|website\node_modules\.|heapCapture\bundle.js|.\tests\.)$/: Unterminated character class.
[01:31:27]
[01:31:27] Metro Bundler process exited with code 1
[01:31:27] Error: Metro Bundler process exited with code 1
at ChildProcess. (C:\Users\Iman\AppData\Roaming\npm\node_modules\expo-cli\node_modules\xdl\src\start\startLegacyReactNativeServerAsync.ts:271:16)
at Object.onceWrapper (events.js:483:26)
at ChildProcess.emit (events.js:376:20)
at ChildProcess.emit (domain.js:470:12)
at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @galio-org/[email protected] start: expo start
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @galio-org/[email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Iman\AppData\Roaming\npm-cache_logs\2021-06-10T08_31_27_555Z-debug.log
What if I want to render my own footer in the cards. Why is it mandatory to use the avatar given. And even if I keep the avatar prop null it still takes space. Don't you think it is better to make it more generic where if the card's avatar prop is null it takes no space in the card?
{cards && cards.map((card, id) => (
<Card
key={`card-${card.image}`}
flex
borderless
shadowColor={theme.COLORS.BLACK}
titleColor={card.full ? theme.COLORS.WHITE : null}
style={styles.card}
image={card.image}
imageStyle={[card.padded ? styles.rounded : null]}
imageBlockStyle={[
card.padded ? { padding: theme.SIZES.BASE / 2 } : null,
card.full ? null : styles.noRadius,
styles.cardImage
]}
footerStyle={card.full ? styles.full : null}
>
<Block flex row space="around" >
{card.full ? <LinearGradient colors={['transparent', 'rgba(0,0,0, 0.3)']} style={styles.gradient} /> : null}
<Block flex={0.3}>{renderAvatar(card.avatar)}</Block>
{renderVote(card.vote)}
{renderLike(card.like)}
</Block>
</Card>
))}
npm WARN tarball tarball data for react-native@https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz (sha512-KBH833yTYW/u2E1KKTAq2jYAqZOgXyLwg/TVpG6JbHyTG424f5gF4CB7KUw==) seems to be corrupted. Trying one more time
Hello there! i just cloned your kit and issued yarn run start
the galio dashboard opened up in my browser but after some seconds it crashed. this is the cli output:
yarn run v1.19.1
$ expo start
Starting project at C:\Users\Admin\Documents\galio-starter-kit
Expo DevTools is running at http://localhost:19002
Opening DevTools in the browser... (press shift-d to disable)
Some of your project's dependencies are not compatible with currently installed expo package version:
- react-native-svg - expected version range: ~9.9.2 - actual version installed: ^9.12.0
Your project may not work correctly until you install the correct versions of the packages.
To install the correct versions of these packages, please run: expo install [package-name ...]
error Invalid regular expression: /(.*\\__fixtures__\\.*|node_modules[\\\]react[\\\]dist[\\\].*|website\\node_modules\\.*|heapCapture\\bundle\.js|.*\\__tests__\\.*)$/: Unterminated character class. Run CLI with --verbose flag for more details.
Metro Bundler process exited with code 1
Set EXPO_DEBUG=true in your env to view the stack trace.
error Command failed with exit code 1.
my environment:
windows 10
node: 12.11.1
yarn: 1.19.1
npm: 6.11.3
cheers!
PS > npm start
@galio-org/[email protected] start x:\yy\zzz
expo start
Starting project at x:\yy\zzz
Expo DevTools is running at http://localhost:19002
Opening DevTools in the browser... (press shift-d to disable)
error Invalid regular expression: /(.\fixtures\.|node_modules[\]react[\]dist[\].|website\node_modules\.|heapCapture\bundle.js|.\tests\.)$/: Unterminated character class.
Metro Bundler process exited with code 1
Set EXPO_DEBUG=true in your env to view the stack trace.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @galio-org/[email protected] start: expo start
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @galio-org/[email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Hi all,
I toke https://galio.io/ with react native.
my code is just tring to use the register page to show it
my code is :
export default function App() {
return (
<View style={styles.container}>
<Login></Login>
{/* <Text>Open up App.tsx to start working on your app!</Text>
<StatusBar style="auto" /> */}
</View>
);
}
The issue when I am trying to use the register example from screen then I got an error
the code of login from this path
style may be false but not true
โถ 27 stack frames were collapsed.
registerRootComponent
C:/src/launch/registerRootComponent.tsx:14
11 | AppRegistry.registerComponent('main', () => withExpoRoot(component));
12 | if (Platform.OS === 'web') {
13 | const rootTag = document.getElementById('root') ?? document.getElementById('main');
> 14 | AppRegistry.runApplication('main', { rootTag });
15 | }
16 | }
17 |
I tried spinning up this project using expo, and on the client app, it gives the error:
"Something went wrong.
This project uses SDK v35.0.0, but this version of the Expo client requires at least v37.0.0."
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: @galio-org/[email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native-svg
npm ERR! react-native-svg@"^9.12.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-svg@"^6.2.1||^7.0.3" from [email protected]
npm ERR! node_modules/react-native-svg-charts
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
Not sure why I'm the only one with an issue here. The latest version of react-native-svg-charts depends on a much older version of react-native-svg than is listed in the dependencies in package.json. I tried to run it after npm install --force
but sure enough that had fatal errors related to react-native-svg
Following the docs for installation, I keep getting the following output:
This command requires Expo CLI.
Do you want to install it globally [Y/n]?
entering "Enter" or "Y", resume the installation, but it keeps repeating itself, over and over again.
> @galio-org/[email protected] start /Users/aviivgi/Documents/projects/com.bigoper.frameworks.mobile/galio.io/galio-starter-kit
> expo start
This command requires Expo CLI.
Do you want to install it globally [Y/n]? Y
Installing the package 'expo-cli'...
Expo CLI installed. You can run `expo --help` for instructions.
This command requires Expo CLI.
Do you want to install it globally [Y/n]?
Mac OSX
node: v15.0.1
npm: 6.14.11
yarn install
yarn install v1.22.10
[1/4] ๐ Resolving packages...
success Already up-to-date.
โจ Done in 0.53s.
Update react-navigation
Update routes.js with multiple routes
Getting following error ..
installed plugin as per the instructions provided in the link , but the error is not going
#################################################################
Failed to compile.
/galio-starter-kit/App.js
SyntaxError:/galio-starter-kit/App.js: Support for the experimental syntax 'jsx' isn't currently enabled (8:7):
6 | render() {
7 | return (
8 | <View style={{ flex: 1 }}>
| ^
9 |
10 |
11 |
Add @babel/plugin-transform-react-jsx (https://git.io/vb4yd) to the 'plugins' section of your Babel config to enable transformation.
where are these files
import Block from './Block';
import Button from './Button';
import Card from './Card';
import Icon from './Icon';
import Input from './Input';
import NavBar from './NavBar';
import Text from './Text';
export {
Block,
Button,
Card,
Icon,
Input,
NavBar,
Text,
};
I cloned and executed the starter kit. Changing the THEME color made the app change color but the PRIMARY one doesn't work.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.