duongdev / phosphor-react-native

phosphor-icons for react-native. A flexible icon family for React Native
https://www.npmjs.com/package/phosphor-react-native
MIT License
174 stars 21 forks source link

Phosphor + Expo: App crash on Android Emulator when trying to run after installing Phosphor icons #28

Open SavioNicodemos opened 1 year ago

SavioNicodemos commented 1 year ago

When I install the library and try to run the app "npx expo start" using android, the app crashes and don't run again:

image

only works in Expo Go usind IOS mobile phone

Examples of use:

import { ArrowUpRight } from "phosphor-react-native";

import { Container } from './styles';

export const Home = () => {
  return (
    <Container>
        <ArrowUpRight size={24} color="red" />
    </Container>
  )
};

or using as a component in styled-components:

import styled from "styled-components/native";
import { ArrowUpRight } from "phosphor-react-native";

export const Container = styled.View`
  flex: 1;
  padding: 24px 24px 0 24px;
  background-color: ${({ theme }) => theme.COLORS.GRAY_7};
`;

export const GoToStatisticsIcon = styled(ArrowUpRight).attrs(({ theme }) => ({
  size: 24,
  color: theme.COLORS.GREEN_MID,
}))``;

The app only runs again when I uninstall the library.

My package.json file:

{
  "name": "dailydiet",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@expo-google-fonts/nunito-sans": "^0.2.3",
    "expo": "~48.0.6",
    "expo-font": "~11.1.1",
    "expo-image": "~1.0.0",
    "expo-status-bar": "~1.4.4",
    "react": "18.2.0",
    "react-native": "0.71.4",
    "styled-components": "^5.3.9"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/react": "~18.0.14",
    "@types/styled-components": "^5.1.26",
    "@types/styled-components-react-native": "^5.2.1",
    "typescript": "^4.9.4"
  },
  "private": true
}

Version of "phosphor-react-native" in use: 1.1.2

SkeBug commented 1 year ago

Hi @SavioNicodemos , I'm facing the same problem, did you find any solution?

Cavdy commented 1 year ago

you can import it via the path

import ArrowUpRight from 'phosphor-react-native/src/icons/ArrowUpRight'

this works @SkeBug @SavioNicodemos

kieis commented 1 year ago

@SavioNicodemos, same here, I had to wipe the emulator. @Cavdy it worked for me.

"expo": "~48.0.18" "phosphor-react-native": "^1.1.2"

andredecarli commented 2 months ago

Issue still happening as of today

"dependencies": {
    "@expo-google-fonts/roboto": "^0.2.3",
    "expo": "~50.0.14",
    "expo-font": "~11.10.3",
    "expo-status-bar": "~1.11.1",
    "phosphor-react-native": "^2.0.0",
    "react": "18.2.0",
    "react-native": "0.73.6",
    "styled-components": "^6.1.8",
    "react-native-svg": "14.1.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/react": "~18.2.45",
    "babel-plugin-module-resolver": "^5.0.0",
    "typescript": "^5.1.3"
  },