Skip to content

Commit e9a6c24

Browse files
shortcutsshortcuts
authored
chore: use vite for browser playground [skip-bc] (#4194)
1 parent 01daf05 commit e9a6c24

File tree

21 files changed

+1164
-4737
lines changed

21 files changed

+1164
-4737
lines changed

‎.github/workflows/check.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -224,6 +224,9 @@ jobs:
224224
- name: Build the playground
225225
run: yarn cli build playground javascript ${{ fromJSON(needs.setup.outputs.JAVASCRIPT_DATA).toRun }}
226226

227+
- name: Build the browser playground
228+
run: yarn workspace javascript-playground-browser build
229+
227230
- name: Run common and requester tests
228231
run: cd clients/algoliasearch-client-javascript && yarn test ${{ !contains(fromJSON(needs.setup.outputs.JAVASCRIPT_DATA).toRun, 'algoliasearch') && '--ignore algoliasearch' || '' }}
229232

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
"workspaces": [
77
"scripts/",
88
"playground/javascript/node/",
9+
"playground/javascript/browser/",
910
"docs/snippets/javascript/",
1011
"docs/guides/javascript/",
1112
"eslint"

‎playground/javascript/browser/.yarn/releases/yarn-4.5.3.cjs

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

‎playground/javascript/browser/.yarnrc.yml

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎playground/javascript/browser/app.css

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

‎playground/javascript/browser/app.ts

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

‎playground/javascript/browser/eslint.config.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import js from '@eslint/js'
2+
import globals from 'globals'
3+
import reactHooks from 'eslint-plugin-react-hooks'
4+
import reactRefresh from 'eslint-plugin-react-refresh'
5+
import tseslint from 'typescript-eslint'
6+
7+
export default tseslint.config(
8+
{ ignores: ['dist'] },
9+
{
10+
extends: [js.configs.recommended, ...tseslint.configs.recommended],
11+
files: ['**/*.{ts,tsx}'],
12+
languageOptions: {
13+
ecmaVersion: 2020,
14+
globals: globals.browser,
15+
},
16+
plugins: {
17+
'react-hooks': reactHooks,
18+
'react-refresh': reactRefresh,
19+
},
20+
rules: {
21+
...reactHooks.configs.recommended.rules,
22+
'react-refresh/only-export-components': [
23+
'warn',
24+
{ allowConstantExport: true },
25+
],
26+
},
27+
},
28+
)

‎playground/javascript/browser/favicon.png

-1.1 KB
Binary file not shown.

‎playground/javascript/browser/index.html

Lines changed: 5 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,13 @@
11
<!doctype html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8" />
5-
<meta
6-
name="viewport"
7-
content="width=device-width, initial-scale=1, shrink-to-fit=no"
8-
/>
9-
10-
<link rel="shortcut icon" href="favicon.png" />
11-
12-
<title>React InstantSearch — Getting started</title>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + React + TS</title>
138
</head>
14-
159
<body>
16-
<noscript> You need to enable JavaScript to run this app. </noscript>
17-
1810
<div id="root"></div>
19-
20-
<script type="module" src="src/index.tsx"></script>
11+
<script type="module" src="/src/main.tsx"></script>
2112
</body>
2213
</html>

‎playground/javascript/browser/package.json

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,33 @@
11
{
2-
"name": "javascript-browser-playground",
3-
"version": "0.0.0",
2+
"name": "javascript-playground-browser",
43
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
56
"scripts": {
6-
"build": "yarn clean && BABEL_ENV=parcel parcel build index.html products.html",
7-
"clean": "rm -rf .parcel-cache node_modules dist || true && yarn",
8-
"start": "yarn clean && BABEL_ENV=parcel parcel index.html products.html --port 3001"
7+
"dev": "vite",
8+
"build": "tsc -b && vite build",
9+
"lint": "eslint .",
10+
"preview": "vite preview"
911
},
1012
"dependencies": {
1113
"algoliasearch": "link:../../../clients/algoliasearch-client-javascript/packages/algoliasearch",
12-
"instantsearch.css": "8.5.1",
13-
"instantsearch.js": "4.75.5",
14-
"react": "18.3.1",
15-
"react-dom": "18.3.1",
16-
"react-instantsearch": "7.13.8"
14+
"instantsearch.css": "^8.5.1",
15+
"react": "^18.3.1",
16+
"react-dom": "^18.3.1",
17+
"react-instantsearch": "^7.13.8"
1718
},
1819
"devDependencies": {
19-
"@parcel/core": "2.13.2",
20-
"@parcel/packager-raw-url": "2.13.2",
21-
"@parcel/transformer-webmanifest": "2.13.2",
22-
"@types/react": "^18.0.9",
23-
"https-browserify": "^1.0.0",
24-
"parcel": "2.13.2",
25-
"stream-http": "^3.1.0",
20+
"@eslint/js": "9.15.0",
21+
"@types/react": "18.3.12",
22+
"@types/react-dom": "18.3.1",
23+
"@vitejs/plugin-react-swc": "3.5.0",
24+
"eslint": "9.15.0",
25+
"eslint-plugin-react-hooks": "5.0.0",
26+
"eslint-plugin-react-refresh": "0.4.14",
27+
"globals": "15.12.0",
2628
"typescript": "5.7.2",
27-
"url": "^0.11.0"
28-
},
29-
"@parcel/resolver-default": {
30-
"packageExports": true
29+
"typescript-eslint": "8.15.0",
30+
"vite": "6.0.1"
3131
},
3232
"packageManager": "[email protected]"
3333
}

‎playground/javascript/browser/products.html

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

‎playground/javascript/browser/public/vite.svg

Lines changed: 1 addition & 0 deletions
Loading

‎playground/javascript/browser/src/index.css

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
:root {
2+
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
3+
line-height: 1.5;
4+
font-weight: 400;
5+
6+
color-scheme: light dark;
7+
color: rgba(255, 255, 255, 0.87);
8+
background-color: #242424;
9+
10+
font-synthesis: none;
11+
text-rendering: optimizeLegibility;
12+
-webkit-font-smoothing: antialiased;
13+
-moz-osx-font-smoothing: grayscale;
14+
}
15+
16+
a {
17+
font-weight: 500;
18+
color: #646cff;
19+
text-decoration: inherit;
20+
}
21+
a:hover {
22+
color: #535bf2;
23+
}
24+
25+
body {
26+
margin: 0;
27+
display: flex;
28+
place-items: center;
29+
min-width: 320px;
30+
min-height: 100vh;
31+
}
32+
33+
h1 {
34+
font-size: 3.2em;
35+
line-height: 1.1;
36+
}
37+
38+
button {
39+
border-radius: 8px;
40+
border: 1px solid transparent;
41+
padding: 0.6em 1.2em;
42+
font-size: 1em;
43+
font-weight: 500;
44+
font-family: inherit;
45+
background-color: #1a1a1a;
46+
cursor: pointer;
47+
transition: border-color 0.25s;
48+
}
49+
button:hover {
50+
border-color: #646cff;
51+
}
52+
button:focus,
53+
button:focus-visible {
54+
outline: 4px auto -webkit-focus-ring-color;
55+
}
56+
57+
@media (prefers-color-scheme: light) {
58+
:root {
59+
color: #213547;
60+
background-color: #ffffff;
61+
}
62+
a:hover {
63+
color: #747bff;
64+
}
65+
button {
66+
background-color: #f9f9f9;
67+
}
68+
}

‎playground/javascript/browser/src/main.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { StrictMode } from 'react'
2+
import { createRoot } from 'react-dom/client'
3+
import './index.css'
4+
import {App} from './App.tsx'
5+
6+
createRoot(document.getElementById('root')!).render(
7+
<StrictMode>
8+
<App />
9+
</StrictMode>,
10+
)

‎playground/javascript/browser/src/vite-env.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="vite/client" />

‎playground/javascript/browser/tsconfig.json

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,26 @@
11
{
2-
"extends": "../../../config/base.tsconfig.json",
32
"compilerOptions": {
4-
"outDir": "dist",
5-
"lib": ["dom"]
3+
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
4+
"target": "ES2020",
5+
"useDefineForClassFields": true,
6+
"lib": ["ES2020", "DOM", "DOM.Iterable"],
7+
"module": "ESNext",
8+
"skipLibCheck": false,
9+
10+
/* Bundler mode */
11+
"moduleResolution": "bundler",
12+
"allowImportingTsExtensions": true,
13+
"isolatedModules": true,
14+
"moduleDetection": "force",
15+
"noEmit": true,
16+
"jsx": "react-jsx",
17+
18+
/* Linting */
19+
"strict": true,
20+
"noUnusedLocals": true,
21+
"noUnusedParameters": true,
22+
"noFallthroughCasesInSwitch": true,
23+
"noUncheckedSideEffectImports": true
624
},
7-
"include": ["*.ts"]
25+
"include": ["src"]
826
}

‎playground/javascript/browser/tsconfig.tsbuildinfo

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"root":["./src/app.tsx","./src/panel.tsx","./src/product.tsx","./src/index.tsx","./src/main.tsx","./src/products.tsx","./src/vite-env.d.ts"],"version":"5.7.2"}

‎playground/javascript/browser/vite.config.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { defineConfig } from 'vite'
2+
import react from '@vitejs/plugin-react-swc'
3+
4+
// https://vite.dev/config/
5+
export default defineConfig({
6+
plugins: [react()],
7+
})

0 commit comments

Comments
 (0)