refactor(frontend): use ESM

packages/frontend/src/directives/click-anime.ts

@@ -4,7 +4,7 @@
  */
 
 import { Directive } from 'vue';
-import { defaultStore } from '@/store';
+import { defaultStore } from '@/store.js';
 
 export default {
 	mounted(el: HTMLElement, binding, vn) {

packages/frontend/src/directives/follow-append.ts

@@ -4,7 +4,7 @@
  */
 
 import { Directive } from 'vue';
-import { getScrollContainer, getScrollPosition } from '@/scripts/scroll';
+import { getScrollContainer, getScrollPosition } from '@/scripts/scroll.js';
 
 export default {
 	mounted(src, binding, vn) {

packages/frontend/src/directives/ripple.ts

@@ -4,7 +4,7 @@
  */
 
 import MkRippleEffect from '@/components/MkRippleEffect.vue';
-import { popup } from '@/os';
+import { popup } from '@/os.js';
 
 export default {
 	mounted(el, binding, vn) {

packages/frontend/src/directives/tooltip.ts

@@ -7,8 +7,8 @@
 // ただディレクティブ内でonUnmountedなどのcomposition api使えるのか不明
 
 import { defineAsyncComponent, Directive, ref } from 'vue';
-import { isTouchUsing } from '@/scripts/touch';
-import { popup, alert } from '@/os';
+import { isTouchUsing } from '@/scripts/touch.js';
+import { popup, alert } from '@/os.js';
 
 const start = isTouchUsing ? 'touchstart' : 'mouseenter';
 const end = isTouchUsing ? 'touchend' : 'mouseleave';

packages/frontend/src/directives/user-preview.ts

@@ -4,7 +4,7 @@
  */
 
 import { defineAsyncComponent, Directive, ref } from 'vue';
-import { popup } from '@/os';
+import { popup } from '@/os.js';
 
 export class UserPreview {
 	private el;