feature: TypeScript

shims-vue.d.ts

@@ -0,0 +1,7 @@
+// shims-vue.d.ts
+declare module '*.vue' {
+    import { DefineComponent } from 'vue';
+    const component: DefineComponent<{}, {}, any>;
+    export default component;
+  }
+  

src/App.vue

@@ -4,6 +4,6 @@
 
 <style scoped></style>
 
-<script setup>
+<script setup lang="ts">
 import { RouterView } from "vue-router";
 </script>

src/views/MainContainer.vue

@@ -10,7 +10,7 @@
   </main>
 </template>
 
-<script>
+<script lang='ts'>
 import { onBeforeMount, } from 'vue';
 import { useRouter } from 'vue-router';
 import { storeToRefs, mapActions, mapState, } from 'pinia';
@@ -41,7 +41,7 @@ export default {
 
     const setHighlightedNavItemOnLanding = () => {
       const currentPath = router.currentRoute.value.path;
-      const pathSegments = currentPath.split('/').filter(segment => segment !== '');
+      const pathSegments: string[] = currentPath.split('/').filter(segment => segment !== '');
       if(pathSegments.length === 1) {
         if(pathSegments[0] === 'files') {
           pageAdminStore.setActivePage('ALL');

tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "strict": true,
+    "jsx": "preserve",
+    "importHelpers": true,
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "sourceMap": true,
+    "baseUrl": ".",
+    "types": ["webpack-env", "jest"],
+    "paths": {
+      "@/*": ["src/*"]
+    },
+    "lib": ["esnext", "dom"],
+    "skipLibCheck": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "tests/**/*.ts", "tests/**/*.tsx"],
+  "exclude": ["node_modules"]
+}