update playground vite config to use sources directly (#3779)

Updating vite configuration to use source of packages in monorepo directly avoiding compilation step

Co-authored-by: Heath C <51679588+heath-freenome@users.noreply.github.com>

packages/playground/package.json

@@ -93,7 +93,7 @@
     "@monaco-editor/react": "^4.5.1",
     "@mui/icons-material": "^5.14.0",
     "@types/react-frame-component": "^4.1.3",
-    "@vitejs/plugin-react": "^3.1.0",
+    "@vitejs/plugin-react": "^4.0.3",
     "cross-env": "^7.0.3",
     "eslint": "^8.44.0",
     "gh-pages": "^3.2.3",
@@ -106,7 +106,7 @@
     "react-transform-hmr": "^1.0.4",
     "rimraf": "^5.0.1",
     "source-map-loader": "^4.0.1",
-    "vite": "^4.4.3"
+    "vite": "^4.4.6"
   },
   "directories": {
     "test": "test"

packages/playground/vite.config.ts

@@ -1,5 +1,6 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
+import * as path from 'path';
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -12,6 +13,23 @@ export default defineConfig({
   plugins: [react()],
   resolve: {
     preserveSymlinks: true, // Fixes https://github.com/rjsf-team/react-jsonschema-form/issues/3228
-    alias: {},
+    alias: {
+      // mapping packages in monorepo to make vite use sources directly avoiding build step
+      "@rjsf/antd" : path.resolve(__dirname, '../antd/src'),
+      "@rjsf/bootstrap-4" : path.resolve(__dirname, '../bootstrap-4/src'),
+      "@rjsf/chakra-ui" : path.resolve(__dirname, '../chakra-ui/src'),
+      "@rjsf/core" : path.resolve(__dirname, '../core/src'),
+      "@rjsf/fluent-ui" : path.resolve(__dirname, '../fluent-ui/src'),
+      "@rjsf/material-ui" : path.resolve(__dirname, '../material-ui/src'),
+      "@rjsf/mui" : path.resolve(__dirname, '../mui/src'),
+      "@rjsf/semantic-ui" : path.resolve(__dirname, '../semantic-ui/src'),
+      "@rjsf/utils": path.resolve(__dirname, '../utils/src'),
+      "@rjsf/validator-ajv8" : path.resolve(__dirname, '../validator-ajv8/src'),
+      // validator-ajv6 can not be mapped directly to the sources, because that causes wrong ajv version resolution
+      // which looks related to: https://github.com/vitejs/vite/issues/12618
+      //
+      // the difference when mapping directly vs mapping to src folder - @vitejs/plugin-react can not be applied in the 2nd case
+      "@rjsf/validator-ajv6" : '@rjsf/validator-ajv6/src',
+    },
   },
 });