feat: 🧑‍💻 add vue devtools in dev

lib/Controller/PageController.php

@@ -8,10 +8,15 @@ use OCA\RePod\AppInfo\Application;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\ContentSecurityPolicy;
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\IConfig;
 use OCP\Util;
 
 class PageController extends Controller
 {
+	public function __construct(
+		private IConfig $config
+	) {}
+
 	/**
 	 * @NoAdminRequired
 	 * @NoCSRFRequired
@@ -23,6 +28,13 @@ class PageController extends Controller
 		$csp->addAllowedImageDomain('*');
 		$csp->addAllowedMediaDomain('*');
 
+		if ($this->config->getSystemValueBool('debug', false)) {
+			/** @psalm-suppress DeprecatedInterface */
+			$csp->allowEvalScript();
+			$csp->addAllowedConnectDomain('*');
+			$csp->addAllowedScriptDomain('*');
+		}
+
 		$response = new TemplateResponse(Application::APP_ID, 'main');
 		$response->setContentSecurityPolicy($csp);
 

package.json

@@ -38,6 +38,7 @@
     "@nextcloud/stylelint-config": "^3.0.1",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-pinia": "^0.2.0",
-    "eslint-plugin-prettier": "^5.2.1"
+    "eslint-plugin-prettier": "^5.2.1",
+    "vite-plugin-vue-devtools": "^7.3.8"
   }
 }

vite.config.mjs

@@ -1,5 +1,6 @@
 import { createAppConfig } from '@nextcloud/vite-config'
 import { defineConfig } from 'vite'
+import vueDevTools from 'vite-plugin-vue-devtools'
 
 const config = defineConfig(({ mode }) => ({
 	build: {
@@ -10,8 +11,12 @@ const config = defineConfig(({ mode }) => ({
 				manualChunks: false,
 			},
 		},
-		sourcemap: mode === 'development',
+		sourcemap: mode !== 'production',
 	},
+	define: {
+		__VUE_PROD_DEVTOOLS__: mode !== 'production'
+	  },
+	plugins: [vueDevTools()],
 }))
 
 export default createAppConfig(