🎨 .. -> ~

public/annotation/example.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.0.0",
+  "version": "2.0.4",
   "annotation": {
     "video": {
       "src": "video/example.mp4",

src/components/Drawer.vue

@@ -41,8 +41,8 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import VersionBadge from '~/components/VersionBadge.vue'
-import { useAnnotationStore } from '../store/annotation.js'
-import { useMainStore } from '../store/index.js'
+import { useAnnotationStore } from '~/store/annotation.js'
+import { useMainStore } from '~/store/index.js'
 import DrawerAnnotationControl from './DrawerAnnotationControl.vue'
 import DrawerVideoControl from './DrawerVideoControl.vue'
 

src/components/DrawerAnnotationControl.vue

@@ -46,8 +46,8 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import { useAnnotation } from '~/hooks/annotation.js'
-import { useAnnotationStore } from '../store/annotation.js'
-import { useMainStore } from '../store/index.js'
+import { useAnnotationStore } from '~/store/annotation.js'
+import { useMainStore } from '~/store/index.js'
 
 const { submitURL } = storeToRefs(useMainStore())
 const annotationStore = useAnnotationStore()

src/libs/utils.js

@@ -2,7 +2,7 @@
  * Utils
  */
 import { Dialog, Notify } from 'quasar'
-import { useAnnotationStore } from '../store/annotation.js'
+import { useAnnotationStore } from '~/store/annotation.js'
 
 export default {
   /**

src/pages/configuration/Configuration.vue

@@ -31,7 +31,7 @@
 <script setup>
 import { exportFile } from 'quasar'
 import { useConfigurationStore } from '~/store/configuration.js'
-import utils from '../../libs/utils.js'
+import utils from '~/libs/utils.js'
 import ActionLabelTable from './ActionLabelTable.vue'
 import ObjectLabelTable from './ObjectLabelTable.vue'
 import SkeletonTypeTable from './SkeletonTypeTable.vue'

src/router/index.js

@@ -8,32 +8,32 @@ const router = createRouter({
     {
       name: 'annotation',
       path: '/',
-      component: () => import('../pages/annotation/Annotation.vue')
+      component: () => import('~/pages/annotation/Annotation.vue')
     },
     {
       name: 'configuration',
       path: '/configuration',
-      component: () => import('../pages/configuration/Configuration.vue')
+      component: () => import('~/pages/configuration/Configuration.vue')
     },
     {
       name: 'preference',
       path: '/preference',
-      component: () => import('../pages/preference/Preference.vue')
+      component: () => import('~/pages/preference/Preference.vue')
     },
     {
       name: 'help',
       path: '/help',
-      component: () => import('../pages/help/Help.vue')
+      component: () => import('~/pages/help/Help.vue')
     },
     {
       name: 'about',
       path: '/about',
-      component: () => import('../pages/about/About.vue')
+      component: () => import('~/pages/about/About.vue')
     },
     {
       name: 'notfound',
       path: '/:pathMatch(.*)*',
-      component: () => import('../pages/notfound/NotFound.vue')
+      component: () => import('~/pages/notfound/NotFound.vue')
     }
   ]
 })

src/store/annotation.js

@@ -4,7 +4,7 @@ import { computed, reactive, toRefs, watch } from 'vue'
 import utils from '~/libs/utils.js'
 import { useMainStore } from '~/store/index.js'
 import { usePreferenceStore } from '~/store/preference.js'
-import { ActionAnnotation, ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '../libs/annotationlib.js'
+import { ActionAnnotation, ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '~/libs/annotationlib.js'
 
 const DEFAULT_ANNOTATION = {
   video: {