chore: migrate cra and vue-cli examples to vite (#490)

* chore: migrate create react app examples to vite

* chore: migrate vue cli examples to vite

notable exceptions are:
- server-side-rendering which isn't worth the migration since we already have an ssr example with vue 3 and vite
- vue3-vue-cli which can be left as an example integration with this specific tooling

* use node 18 for react

Author: dhayab

.circleci/config.yml

@@ -68,7 +68,7 @@ jobs:
           path: 'angular-instantsearch/secured-api-keys'
 
   build_react_projects:
-    executor: node14
+    executor: node18
     steps:
       - checkout
       - build_project:

react-instantsearch/algolia-insights/public/index.html renamed to react-instantsearch/algolia-insights/index.html

@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
   <meta name="theme-color" content="#000000">
 
-  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
+  <link rel="shortcut icon" href="/favicon.png">
 
   <!--
     Do not use @7 in production, use a complete version like x.x.x, see website for latest version:
@@ -23,6 +23,7 @@
   </noscript>
 
   <div id="root"></div>
+  <script type="module" src="/src/index.jsx"></script>
 </body>
 
 </html>

react-instantsearch/algolia-insights/package.json

@@ -4,33 +4,16 @@
   "private": true,
   "dependencies": {
     "algoliasearch": "^4.13.0",
-    "instantsearch.css": "^7.4.5",
-    "instantsearch.js": "4.56.8",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
-    "react-instantsearch": "7.0.0",
-    "react-scripts": "5.0.1"
+    "react-instantsearch": "7.0.0"
   },
-  "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+  "devDependencies": {
+    "@vitejs/plugin-react": "4.3.1",
+    "vite": "5.3.3"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
+  "scripts": {
+    "start": "vite",
+    "build": "vite build"
   }
 }

react-instantsearch/algolia-insights/src/App.js renamed to react-instantsearch/algolia-insights/src/App.jsx

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  server: { port: 3000 },
+  plugins: [react()]
+})

react-instantsearch/algolia-insights/src/index.js renamed to react-instantsearch/algolia-insights/src/index.jsx

@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
   <meta name="theme-color" content="#000000">
 
-  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
+  <link rel="shortcut icon" href="/favicon.png">
 
   <title>conditional-debouncing</title>
 </head>
@@ -17,6 +17,7 @@
   </noscript>
 
   <div id="root"></div>
+  <script type="module" src="/src/index.jsx"></script>
 </body>
 
 </html>

react-instantsearch/algolia-insights/vite.config.js

@@ -7,29 +7,14 @@
     "instantsearch.css": "^7.4.5",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
-    "react-instantsearch": "7.0.0",
-    "react-scripts": "^5.0.1"
+    "react-instantsearch": "7.0.0"
   },
-  "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+  "devDependencies": {
+    "@vitejs/plugin-react": "4.3.1",
+    "vite": "5.3.3"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
+  "scripts": {
+    "start": "vite",
+    "build": "vite build"
   }
 }