Skip to content

Commit 83aac47

Browse files
haoAddsearchhaoAddsearch
committed
Migrate from react-scripts (not recommended by React dev) to Vite
1 parent 27b2e2f commit 83aac47

File tree

8 files changed

+3251
-16710
lines changed

8 files changed

+3251
-16710
lines changed

‎index.html

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Search UI React TypeScript Example</title>
8+
9+
<!-- AddSearch UI Libraries -->
10+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/addsearch-js-client.min.js"></script>
11+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/addsearch-search-ui.min.js"></script>
12+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/addsearch-search-ui.min.css" />
13+
</head>
14+
<body>
15+
<div id="root"></div>
16+
<script type="module" src="/src/index.tsx"></script>
17+
</body>
18+
</html>

‎package-lock.json

+3,170-16,671
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+17-14
Original file line numberDiff line numberDiff line change
@@ -2,31 +2,34 @@
22
"name": "search-ui-react-typescript-example",
33
"version": "0.1.0",
44
"private": true,
5+
"scripts": {
6+
"dev": "vite",
7+
"start": "vite",
8+
"build": "tsc && vite build",
9+
"preview": "vite preview",
10+
"test": "vitest run",
11+
"test:watch": "vitest"
12+
},
513
"dependencies": {
614
"@testing-library/jest-dom": "^5.17.0",
715
"@testing-library/react": "^13.4.0",
816
"@testing-library/user-event": "^13.5.0",
9-
"@types/jest": "^27.5.2",
10-
"@types/node": "^16.18.105",
11-
"@types/react": "^18.3.3",
17+
"@types/node": "^22.13.9",
18+
"@types/react": "^18.3.18",
1219
"@types/react-dom": "^18.3.0",
1320
"react": "^18.3.1",
1421
"react-dom": "^18.3.1",
15-
"react-scripts": "5.0.1",
1622
"typescript": "^4.9.5",
1723
"web-vitals": "^2.1.4"
1824
},
19-
"scripts": {
20-
"start": "react-scripts start",
21-
"build": "react-scripts build",
22-
"test": "react-scripts test",
23-
"eject": "react-scripts eject"
25+
"devDependencies": {
26+
"@vitejs/plugin-react": "^4.2.1",
27+
"vite": "^5.1.4",
28+
"vitest": "^1.1.0",
29+
"jsdom": "^23.0.1"
2430
},
25-
"eslintConfig": {
26-
"extends": [
27-
"react-app",
28-
"react-app/jest"
29-
]
31+
"overrides": {
32+
"esbuild": "0.25.0"
3033
},
3134
"browserslist": {
3235
"production": [

‎public/index.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@
1010
/>
1111

1212
<!-- AddSearch UI Libraries -->
13-
<script src="https://cdn.jsdelivr.net/npm/addsearch-js-client@0.8/dist/addsearch-js-client.min.js"></script>
14-
<script src="https://cdn.jsdelivr.net/npm/addsearch-search-ui@0.8/dist/addsearch-search-ui.min.js"></script>
15-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/addsearch-search-ui@0.8/dist/addsearch-search-ui.min.css" />
13+
<script src="https://cdn.jsdelivr.net/npm/addsearch-js-client@1.0/dist/addsearch-js-client.min.js"></script>
14+
<script src="https://cdn.jsdelivr.net/npm/addsearch-search-ui@0.9/dist/addsearch-search-ui.min.js"></script>
15+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/addsearch-search-ui@0.9/dist/addsearch-search-ui.min.css" />
1616

1717
<title>Search UI Example</title>
1818
</head>

‎src/index.tsx

+1-5
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,12 @@ import './index.css';
44
import App from './App';
55
import reportWebVitals from './reportWebVitals';
66

7-
const root = ReactDOM.createRoot(
8-
document.getElementById('root') as HTMLElement
9-
);
10-
root.render(
7+
ReactDOM.createRoot(document.getElementById('root')!).render(
118
<React.StrictMode>
129
<App />
1310
</React.StrictMode>
1411
);
1512

1613
// If you want to start measuring performance in your app, pass a function
1714
// to log results (for example: reportWebVitals(console.log))
18-
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
1915
reportWebVitals();

‎tsconfig.json

+12-17
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,21 @@
11
{
22
"compilerOptions": {
3-
"target": "es5",
4-
"lib": [
5-
"dom",
6-
"dom.iterable",
7-
"esnext"
8-
],
9-
"allowJs": true,
3+
"target": "ESNext",
4+
"lib": ["DOM", "DOM.Iterable", "ESNext"],
5+
"module": "ESNext",
106
"skipLibCheck": true,
11-
"esModuleInterop": true,
7+
"moduleResolution": "node", // Change this from "bundler" to "node"
128
"allowSyntheticDefaultImports": true,
13-
"strict": true,
14-
"forceConsistentCasingInFileNames": true,
15-
"noFallthroughCasesInSwitch": true,
16-
"module": "esnext",
17-
"moduleResolution": "node",
189
"resolveJsonModule": true,
1910
"isolatedModules": true,
2011
"noEmit": true,
21-
"jsx": "react-jsx"
12+
"jsx": "react-jsx",
13+
"strict": true,
14+
"noUnusedLocals": true,
15+
"noUnusedParameters": true,
16+
"noFallthroughCasesInSwitch": true,
17+
"types": ["vite/client"] // Add this line
2218
},
23-
"include": [
24-
"src"
25-
]
19+
"include": ["src"],
20+
"references": [{ "path": "./tsconfig.node.json" }]
2621
}

‎tsconfig.node.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"skipLibCheck": true,
5+
"module": "ESNext",
6+
"moduleResolution": "node", // Change this from "bundler" to "node"
7+
"allowSyntheticDefaultImports": true
8+
},
9+
"include": ["vite.config.ts"]
10+
}

‎vite.config.ts

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { defineConfig } from 'vite';
2+
import react from '@vitejs/plugin-react';
3+
import path from 'path';
4+
5+
export default defineConfig({
6+
plugins: [react()],
7+
resolve: {
8+
alias: {
9+
'@': path.resolve(__dirname, './src'),
10+
},
11+
},
12+
server: {
13+
port: 3000,
14+
open: true,
15+
},
16+
// Handle external scripts that use AddSearchClient and AddSearchUI
17+
optimizeDeps: {
18+
exclude: ['AddSearchClient', 'AddSearchUI'],
19+
},
20+
});

0 commit comments

Comments
 (0)