microsoft / react-native-code-push

React Native module for CodePush
http://appcenter.ms
Other
8.95k stars 1.46k forks source link

Icons and Fonts from intern design system not pushed #2684

Closed Neeal20 closed 3 months ago

Neeal20 commented 6 months ago

Steps to Reproduce

Create a version Make CodePush bundle Push it to Appcenter Enable the code-push bundle Expected Behavior I was expecting the CodePush bundle to push the fonts and icons which are located inside a library.

Actual Behavior

CodePush is working fine and all projects are getting updated, along with the assets located inside the projects. However, the problem arises with the fonts and icons (especially the icons) which are handled by our internal design system library. These resources are not getting pushed with the CodePush, causing them to completely disappear from the app.

Environment

Description

The icons which are located inside our design system library are handled with "WithLocalSVG".

Do you have any idea how can I either keep our fonts and icons on the CodePush or how can we bundle it again ?

Thanks by advance.

cristea2017 commented 6 months ago

same here, but for me ios is working good, only android (release mode) doesn't show up svg (dev is working) tested with "react-native-code-push": "^8.1.0" and last one "react-native-code-push": "^8.2.1",

here is a demo :

https://github.com/microsoft/react-native-code-push/assets/28201006/84b09610-e7d6-4041-ad07-0396d2dd1dc8

cristea2017 commented 6 months ago

Update: Here is my workaround little lifehack to make svg work @_@

  1. Convert svg to React components (you can use svgviewer )
  2. Declare svgImages or whatever you want with svg components
  3. Create component that will receive name prop like this
    
    type Props = {
    size: number;
    height?: number;
    name: SvgAssetName;
    color?: string;
    };

const SvgImageUI = ({size = 25, name, color = 'black', height}: Props) => { const SVGComponent = svgImages[name]; return ( <View style={{ width: size, height: height ? height : size, }}

); };

  1. use global component
              <SvgImageUI name="app_icon" size={20} />

Here is an example

Screenshot 2024-03-29 at 11 06 45
Neeal20 commented 6 months ago

Ok a lot hanks for this, but I think it's not the same use case. Might not be enough precise.

I have already tried to make SVG worked inside my project, and it went good with some change in the react-native-metro config. But it was working because the SVG files were inside my project which we will call "Project A".

The problem I have right now is :

We are consuming a design system library which is called "Project B". Inside of this project, we use an component which include some SVG images integrated with WithLocalSVG. The problem with that, I assume is that because of the SVG files images being outside of the Project A, CodePush cannot bundle the Icons Images.

Or at least, I would like to not delete the previous Icons coming from the Project B when I'm doing a CodePush release

MikhailSuendukov commented 3 months ago

Hi, could you please provide a small demo application that reproduces this error? This would greatly assist us in investigating and resolving the issue.