Merge pull request #121 from smoores-dev/main

Properly externalize bundles (and move React to peer dep)

frontend/package.json

@@ -20,9 +20,7 @@
     "semantic-release": "semantic-release"
   },
   "dependencies": {
-    "react": "^18.3.1",
     "react-collapsible": "^2.10.0",
-    "react-dom": "^18.3.1",
     "react-icons": "^5.2.1",
     "react-loading": "^2.0.3"
   },
@@ -35,10 +33,16 @@
     "eslint-plugin-react": "^7.34.2",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.7",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "sass": "^1.77.6",
     "semantic-release": "^24.1.0",
     "vite": "^5.4.6"
   },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
   "description": "React File Manager is an open-source, user-friendly component designed to easily manage files and folders within applications. With smooth drag-and-drop functionality, responsive design, and efficient navigation, it simplifies file handling in any React project.",
   "main": "src/index.js",
   "repository": {

frontend/vite.config.js

@@ -1,5 +1,6 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react-swc";
+import packageJson from "./package.json";
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -13,7 +14,14 @@ export default defineConfig({
       formats: ["es"],
     },
     rollupOptions: {
-      external: ["react", "react-dom"],
+      external: [
+        ...Object.keys(packageJson.dependencies).map(
+          (mod) => new RegExp(`^${mod}`)
+        ),
+        ...Object.keys(packageJson.peerDependencies).map(
+          (mod) => new RegExp(`^${mod}`)
+        ),
+      ],
       output: {
         globals: {
           react: "React",