Skip to content

Commit 9a89833

Browse files
amirna2amirna2
authored
Fix vite webpack node polyfills (#233)
Signed-off-by: Amir Nathoo <[email protected]>
1 parent b3ceb9a commit 9a89833

File tree

14 files changed

+5930
-6061
lines changed

14 files changed

+5930
-6061
lines changed

‎examples/realtime-video/Makefile‎

Lines changed: 28 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,35 @@
11
build:
22
npm run build
3-
4-
deploy:
3+
4+
clean:
5+
rm -rf node_modules package-lock.json dist
6+
7+
install:
8+
npm install
9+
10+
clean-install: clean install
11+
12+
local-dev:
13+
npm run dev
14+
15+
local-build:
516
npm run build
617
cp schema.json dist
7-
cd dist && sed -i'' -e 's/"\/assets/"\.\/assets/g' index.html
18+
19+
local-preview: local-build
20+
npm run preview
21+
22+
deploy-prep:
23+
npm run build
24+
cp schema.json dist
25+
cd dist && sed -i'' -e 's/"\/assets/"\.\/assets/g' index.html
26+
27+
deploy: deploy-prep
828
git add -f dist
929
git commit -m 'publish demo'
1030
git push
31+
32+
deploy-with-upstream: deploy-prep
33+
git add -f dist
34+
git commit -m 'publish demo'
35+
git push --set-upstream origin $(shell git branch --show-current)

‎examples/realtime-video/README.md‎

Lines changed: 52 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,54 @@
11
## Realtime Video
22

3-
A real-time, peer-to-peer module application that displays a video feed from a camera, allowing users to connect and view the feed simply by knowing the camera name.
3+
A real-time, peer-to-peer module application that displays a video feed from a camera, allowing users to connect and view the feed simply by knowing the camera name.
4+
5+
## Features
6+
7+
- Real-time H.264 video streaming with bandwidth optimization
8+
- WebRTC connection management
9+
10+
## Node.js Polyfills
11+
12+
This module uses Vite with Node.js polyfills to handle Formant SDK dependencies that contain Node.js-specific code. The polyfills are configured in:
13+
14+
- **vite.config.ts**: Uses `vite-plugin-node-polyfills` for automatic polyfills
15+
- **src/polyfills.ts**: Manual polyfill for `setImmediate` (required for WebRTC)
16+
17+
## Local Development
18+
19+
```bash
20+
# Install dependencies
21+
make install
22+
23+
# Clean install (useful when updating SDK versions)
24+
make clean-install
25+
26+
# Local development server (port 5173)
27+
make local-dev
28+
29+
# Test built version locally (port 4173)
30+
make local-preview
31+
```
32+
33+
## Deployment
34+
35+
```bash
36+
# Prepare deployment files
37+
make deploy-prep
38+
39+
# Deploy to current branch
40+
make deploy
41+
42+
# Deploy to new branch (sets upstream automatically)
43+
make deploy-with-upstream
44+
```
45+
46+
## Troubleshooting
47+
48+
If you encounter "process is not defined" or "setImmediate is not defined" errors:
49+
50+
1. Ensure `vite-plugin-node-polyfills` is installed
51+
2. Verify `src/polyfills.ts` is imported first in `src/main.tsx`
52+
3. Check that Vite config includes the node polyfills plugin
53+
54+
These polyfills are required because the Formant SDK contains webpack-bundled code with Node.js globals that Vite needs help handling.

‎examples/realtime-video/dist/assets/index-643462ad.js‎

Lines changed: 0 additions & 210 deletions
This file was deleted.

‎examples/realtime-video/dist/assets/index-90298d3b.js‎

Lines changed: 264 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/realtime-video/dist/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
77
<title>Vite + React + TS</title>
8-
<script type="module" crossorigin src="./assets/index-643462ad.js"></script>
8+
<script type="module" crossorigin src="./assets/index-90298d3b.js"></script>
99
<link rel="stylesheet" href="./assets/index-99e015fe.css">
1010
</head>
1111
<body>

0 commit comments

Comments
 (0)