feast-dev / feast-dev/feast

Feast UI fails to load in Vite due to dynamic icon imports (`arrow_down` module not found)

Open
#5,429 2 comments 1 reaction 1 assignee Claimed by @kchawlani19 View on GitHub
kind/bug priority/p2
Dominant language
Python
Stars
7.3k
Forks
1.4k
Avg merge
3d 16h
Merged PRs (30d)
15

Description

## Expected Behavior
Feast UI when imported as React module should work with Vite.

## Current Behavior
When integrating Feast UI into a Vite-based React project, the application fails to load, displaying the following error: `Error: Module not found in bundle: ./assets/arrow_down`.

## Steps to reproduce
How to get `Error: Module not found in bundle: ./assets/arrow_down`:

1. Create new React + TypeScript + Vite project by running the following commnd:
```bash
yarn create vite myapp --template react-ts
cd myapp
yarn
```

2. Install Feast UI and its dependencies:
```bash
yarn add @feast-dev/feast-ui @elastic/eui @emotion/react
```

3. Import Feast UI as it says in the [current documentation](https://docs.feast.dev/v0.49-branch/reference/alpha-web-ui)
```tsx
import React from 'react';
import ReactDOM from 'react-dom/client';
import '@feast-dev/feast-ui/dist/feast-ui.css';
import FeastUI from '@feast-dev/feast-ui';

ReactDOM.createRoot(document.getElementById('root')!).render(



);
```

4. Run the development server
```bash
yarn dev
```

5. Observe the error in the browser console as well as on the screen

![Image](https://github.com/user-attachments/assets/78ae0f63-958b-483f-9409-1473539d3b3a)

### Specifications

- Version:
```json
"dependencies": {
"@elastic/eui": "^102.3.0",
"@emotion/react": "^11.14.0",
"@feast-dev/feast-ui": "^0.49.0",
"react": "18.3.1",
"react-dom": "18.3.1"
}
```

## Possible Solution
The issue stems from Elastic UI's use of dynamic imports for icons, which Vite cannot statically analyze. A potential solution is to pre-bundle the required icons by statically importing them.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.