RocketCommunicationsInc / astro

Astro UXDS is a collection of guidelines, patterns and components for designing space-based user interface applications.
https://astrouxds.com
Other
113 stars 25 forks source link

RuxIcons do not appear properly in production build of Create React App #1097

Closed kiley-mitti closed 1 year ago

kiley-mitti commented 1 year ago

Describe the bug When using CRA as the basis for creating a new React project, RuxIcons show up fine in dev, but in production they disappear.

To Reproduce Steps to reproduce the behavior:

  1. spin up a create react app
  2. install @astrouxds/react
  3. import { RuxIcon } into your App
  4. use in your application

Current behavior RuxIcons should appear in production build

Expected behavior They do not.

CodeSandbox If applicable, please provide a CodeSandbox or other online code editor tool link that contains an example of the bug.

Because the problem only reveals itself in production, I've produced a bare bones CRA with @astrouxds/react installed and deployed it to illustrate:

Example: React CRA Example Repository: kiley-mitti/icon-test

Environment (please complete the following information):

Additional context I suspect tree shaking is the culprit. Shook tree too hard.

markacianfrani commented 1 year ago

technically this is the feature, you always had to manually import individual icons in addition to rux-icon when treeshaking https://astro-components.netlify.app/?path=/docs/components-icons--default-story#cherry-picking

where it might be confusing though is that consumers of @astrouxds/react might not have been aware that they weren't actually using the treeshaking build, even though they still had to manually import individual components

micahjones13 commented 1 year ago

@kiley-mitti when you get some time, could you verify that the latest version of @astrouxds/react fixes this problem?

kiley-mitti commented 1 year ago

Sure thing! I made a new CRA with latest version of @astrouxds/react and it appears to work in dev and build!