> ## Documentation Index
> Fetch the complete documentation index at: https://docs.layerswap.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Vite.js Polyfills

> Configure polyfills for Vite.js projects using the Layerswap Widget.

## Vite.js requires global and process polyfills

If you're using Vite.js with React and the Layerswap Widget, you may encounter this error in your console:

```
util.js:109 Uncaught ReferenceError: process is not defined
```

This happens because some libraries that the widget depends on use the `process` module, which is not available in the browser environment and is not automatically polyfilled by Vite.

### Polyfill `process` using `vite.config.js`

To resolve this, modify your `vite.config.js` file with the following plugins:

```TypeScript theme={null}
import react from '@vitejs/plugin-react'
import { defineConfig } from 'vite'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), nodePolyfills()],
  esbuild: {
    target: 'esnext',
  },

  server: {
    port: 3000,
    open: true,
  },
})
```

### Install the required packages

Make sure to install the polyfill plugins:

<CodeGroup>
  ```bash npm theme={null}
  npm install -D vite-plugin-node-polyfills @vitejs/plugin-react
  ```

  ```bash yarn theme={null}
  yarn add -D vite-plugin-node-polyfills @vitejs/plugin-react
  ```

  ```bash pnpm theme={null}
  pnpm add -D vite-plugin-node-polyfills @vitejs/plugin-react
  ```
</CodeGroup>

### Example Project

For a complete working example of a Vite.js project with the Layerswap Widget, check out our [Vite example in the monorepo](https://github.com/layerswap/layerswapapp/tree/dev-monorepo/examples/vite).
