fix: ensure react/next/vue sdks get the right cdn path from env (#334)

revertinc · Oct 26, 2023 · 80cd77d · 80cd77d · vercel · Oct 26, 2023
1 parent 68380a4
commit 80cd77d
Show file tree

Hide file tree

Showing 9 changed files with 43 additions and 9 deletions.
diff --git a/packages/js/package.json b/packages/js/package.json
@@ -4,7 +4,7 @@
     "description": "Client side javascript sdk",
     "scripts": {
         "dev": "concurrently --kill-others \"yarn run watch:ts\" \"yarn workspace @revertdotdev/revert-react dev\"",
-        "watch:ts": "nodemon -w src/index.ts --exec \"yarn run build && cp dist/revert.js ../react/src/lib/build/revert-dev.js\"",
+        "watch:ts": "nodemon -w src/index.ts --exec \"yarn run build && cp dist/revert.js ../react/src/lib/build/revert-dev.js && cp dist/revert.js ../vue/src/lib/build/revert-dev.js\"",
         "test": "npm test",
         "build": "npm run prebuild && vite build",
         "prebuild": "tsc && babel src -d lib && browserify lib/index.js -o lib/bundle.js",

diff --git a/packages/react/.env.example b/packages/react/.env.example
@@ -0,0 +1,7 @@
+# locally
+#
+# CDN_PATH=src/lib/build/revert-dev.js
+
+# While building for deployment
+#
+# CDN_PATH=https://cdn.revert.dev/revert.js
diff --git a/packages/react/package.json b/packages/react/package.json
@@ -1,9 +1,9 @@
 {
     "name": "@revertdotdev/revert-react",
-    "version": "0.0.17",
+    "version": "0.0.17-rc2",
     "repository": {
         "type": "git",
-        "url": "https://github.com/revertinc/Revert.git"
+        "url": "https://github.com/revertinc/revert.git"
     },
     "scripts": {
         "dev": "vite",

diff --git a/packages/react/src/lib/useRevertConnect.ts b/packages/react/src/lib/useRevertConnect.ts
@@ -12,13 +12,14 @@ if (typeof window !== 'undefined') {
     window.Revert = window.Revert || {};
 }
 
+declare var __CDN_PATH__: string;
+
 export function useRevertConnectScript() {
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState<Error | null>(null);
 
     useEffect(() => {
-        const src =
-            process.env.NODE_ENV === 'development' ? 'src/lib/build/revert-dev.js' : 'https://cdn.revert.dev/revert.js';
+        const src = `${__CDN_PATH__}`;
         const script = document.createElement('script');
         script.src = src;
         script.async = true;

diff --git a/packages/react/vite.config.ts b/packages/react/vite.config.ts
@@ -2,8 +2,17 @@ import react from '@vitejs/plugin-react';
 import path from 'node:path';
 import { defineConfig } from 'vite';
 import dts from 'vite-plugin-dts';
+import dotenv from 'dotenv';
+
+dotenv.config(); // load env vars from .env
 
 export default defineConfig({
+    /**
+     * This injects the environment variables into the code.
+     */
+    define: {
+        __CDN_PATH__: `"${process.env.CDN_PATH || 'src/lib/build/revert-dev.js'}"`,
+    },
     server: {
         port: 3001,
     },

diff --git a/packages/vue/.env.example b/packages/vue/.env.example
@@ -0,0 +1,7 @@
+# locally
+#
+# CDN_PATH=src/lib/build/revert-dev.js
+
+# While building for deployment
+#
+# CDN_PATH=https://cdn.revert.dev/revert.js
diff --git a/packages/vue/package.json b/packages/vue/package.json
@@ -1,12 +1,12 @@
 {
     "name": "@revertdotdev/revert-vue",
-    "version": "0.0.8",
+    "version": "0.0.8-rc",
     "publishConfig": {
         "access": "public"
     },
     "repository": {
         "type": "git",
-        "url": "https://github.com/revertinc/Revert.git"
+        "url": "https://github.com/revertinc/revert.git"
     },
     "scripts": {
         "dev": "vite --host",

diff --git a/packages/vue/src/lib/useRevertConnect.ts b/packages/vue/src/lib/useRevertConnect.ts
@@ -12,13 +12,14 @@ if (typeof window !== 'undefined') {
     window.Revert = window.Revert || {};
 }
 
+declare const __CDN_PATH__: string;
+
 export const useRevertConnectScript = () => {
     const loading = ref(true);
     const error = ref('');
 
     onMounted(() => {
-        const src =
-            process.env.NODE_ENV === 'development' ? 'src/lib/revert-dev.js' : 'https://cdn.revert.dev/revert.js';
+        const src = `${__CDN_PATH__}`;
         const script = document.createElement('script');
         script.src = src;
         script.async = true;

diff --git a/packages/vue/vite.config.ts b/packages/vue/vite.config.ts
@@ -2,8 +2,17 @@ import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue';
 import dts from 'vite-plugin-dts';
 import { resolve } from 'path';
+import dotenv from 'dotenv';
+
+dotenv.config(); // load env vars from .env
 
 export default defineConfig({
+    /**
+     * This injects the environment variables into the code.
+     */
+    define: {
+        __CDN_PATH__: `"${process.env.CDN_PATH || 'src/lib/build/revert-dev.js'}"`,
+    },
     plugins: [vue(), dts({ insertTypesEntry: true })],
     build: {
         sourcemap: true,