diff --git a/src/client/@types/vue.d.ts b/src/client/@types/vue.d.ts
index 0a79ecbb1..2b97bd961 100644
--- a/src/client/@types/vue.d.ts
+++ b/src/client/@types/vue.d.ts
@@ -1,5 +1,5 @@
 declare module '*.vue' {
-	import { defineComponent } from 'vue';
-	const component: ReturnType<typeof defineComponent>;
-	export default component;
+  import type { DefineComponent } from 'vue'
+  const component: DefineComponent<{}, {}, any>
+  export default component
 }
diff --git a/src/client/components/ui/a.vue b/src/client/components/global/a.vue
similarity index 100%
rename from src/client/components/ui/a.vue
rename to src/client/components/global/a.vue
diff --git a/src/client/components/acct.vue b/src/client/components/global/acct.vue
similarity index 100%
rename from src/client/components/acct.vue
rename to src/client/components/global/acct.vue
diff --git a/src/client/components/avatar.vue b/src/client/components/global/avatar.vue
similarity index 97%
rename from src/client/components/avatar.vue
rename to src/client/components/global/avatar.vue
index d90607bb8..1cfead919 100644
--- a/src/client/components/avatar.vue
+++ b/src/client/components/global/avatar.vue
@@ -11,7 +11,7 @@
 import { defineComponent } from 'vue';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
 import { extractAvgColorFromBlurhash } from '@/scripts/extract-avg-color-from-blurhash';
-import { acct, userPage } from '../filters/user';
+import { acct, userPage } from '@/filters/user';
 
 export default defineComponent({
 	props: {
diff --git a/src/client/components/ellipsis.vue b/src/client/components/global/ellipsis.vue
similarity index 100%
rename from src/client/components/ellipsis.vue
rename to src/client/components/global/ellipsis.vue
diff --git a/src/client/components/emoji.vue b/src/client/components/global/emoji.vue
similarity index 97%
rename from src/client/components/emoji.vue
rename to src/client/components/global/emoji.vue
index b2bf7f016..e93cdb6f3 100644
--- a/src/client/components/emoji.vue
+++ b/src/client/components/global/emoji.vue
@@ -8,7 +8,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
-import { twemojiSvgBase } from '../../misc/twemoji-base';
+import { twemojiSvgBase } from '@/../misc/twemoji-base';
 
 export default defineComponent({
 	props: {
diff --git a/src/client/components/error.vue b/src/client/components/global/error.vue
similarity index 94%
rename from src/client/components/error.vue
rename to src/client/components/global/error.vue
index cac24efc8..311093dac 100644
--- a/src/client/components/error.vue
+++ b/src/client/components/global/error.vue
@@ -11,7 +11,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
-import MkButton from './ui/button.vue';
+import MkButton from '@/components/ui/button.vue';
 
 export default defineComponent({
 	components: {
diff --git a/src/client/components/loading.vue b/src/client/components/global/loading.vue
similarity index 100%
rename from src/client/components/loading.vue
rename to src/client/components/global/loading.vue
diff --git a/src/client/components/misskey-flavored-markdown.vue b/src/client/components/global/misskey-flavored-markdown.vue
similarity index 99%
rename from src/client/components/misskey-flavored-markdown.vue
rename to src/client/components/global/misskey-flavored-markdown.vue
index 3123d7aa8..a89d2d3a2 100644
--- a/src/client/components/misskey-flavored-markdown.vue
+++ b/src/client/components/global/misskey-flavored-markdown.vue
@@ -4,7 +4,7 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import MfmCore from './mfm';
+import MfmCore from '@/components/mfm';
 
 export default defineComponent({
 	components: {
diff --git a/src/client/components/time.vue b/src/client/components/global/time.vue
similarity index 100%
rename from src/client/components/time.vue
rename to src/client/components/global/time.vue
diff --git a/src/client/components/url.vue b/src/client/components/global/url.vue
similarity index 100%
rename from src/client/components/url.vue
rename to src/client/components/global/url.vue
diff --git a/src/client/components/user-name.vue b/src/client/components/global/user-name.vue
similarity index 100%
rename from src/client/components/user-name.vue
rename to src/client/components/global/user-name.vue
diff --git a/src/client/components/index.ts b/src/client/components/index.ts
index 92a29ded1..cccb5d766 100644
--- a/src/client/components/index.ts
+++ b/src/client/components/index.ts
@@ -1,16 +1,16 @@
 import { App } from 'vue';
 
-import mfm from './misskey-flavored-markdown.vue';
-import a from './ui/a.vue';
-import acct from './acct.vue';
-import avatar from './avatar.vue';
-import emoji from './emoji.vue';
-import userName from './user-name.vue';
-import ellipsis from './ellipsis.vue';
-import time from './time.vue';
-import url from './url.vue';
-import loading from './loading.vue';
-import error from './error.vue';
+import mfm from './global/misskey-flavored-markdown.vue';
+import a from './global/a.vue';
+import acct from './global/acct.vue';
+import avatar from './global/avatar.vue';
+import emoji from './global/emoji.vue';
+import userName from './global/user-name.vue';
+import ellipsis from './global/ellipsis.vue';
+import time from './global/time.vue';
+import url from './global/url.vue';
+import loading from './global/loading.vue';
+import error from './global/error.vue';
 
 export default function(app: App) {
 	app.component('Mfm', mfm);
diff --git a/src/client/components/mfm.ts b/src/client/components/mfm.ts
index 1960461a1..a403e9a68 100644
--- a/src/client/components/mfm.ts
+++ b/src/client/components/mfm.ts
@@ -1,15 +1,15 @@
 import { VNode, defineComponent, h } from 'vue';
-import { MfmForest } from '../../mfm/prelude';
-import { parse, parsePlain } from '../../mfm/parse';
-import MkUrl from './url.vue';
-import MkLink from './link.vue';
-import MkMention from './mention.vue';
-import MkEmoji from './emoji.vue';
-import { concat } from '../../prelude/array';
-import MkFormula from './formula.vue';
-import MkCode from './code.vue';
-import MkGoogle from './google.vue';
-import MkA from './ui/a.vue';
+import { MfmForest } from '@/../mfm/prelude';
+import { parse, parsePlain } from '@/../mfm/parse';
+import MkUrl from '@/components/global/url.vue';
+import MkLink from '@/components/link.vue';
+import MkMention from '@/components/mention.vue';
+import MkEmoji from '@/components/global/emoji.vue';
+import { concat } from '@/../prelude/array';
+import MkFormula from '@/components/formula.vue';
+import MkCode from '@/components/code.vue';
+import MkGoogle from '@/components/google.vue';
+import MkA from '@/components/global/a.vue';
 import { host } from '@/config';
 
 export default defineComponent({
diff --git a/vetur.config.js b/vetur.config.js
new file mode 100644
index 000000000..601aa27d1
--- /dev/null
+++ b/vetur.config.js
@@ -0,0 +1,41 @@
+// vetur.config.js
+/** @type {import('vls').VeturConfig} */
+module.exports = {
+  // **optional** default: `{}`
+  // override vscode settings
+  // Notice: It only affects the settings used by Vetur.
+  settings: {
+    "vetur.useWorkspaceDependencies": true,
+    "vetur.experimental.templateInterpolationService": true
+  },
+  // **optional** default: `[{ root: './' }]`
+  // support monorepos
+  projects: [
+    {
+      // **required**
+      // Where is your project?
+      // It is relative to `vetur.config.js`.
+      root: './src/client',
+      // **optional** default: `'package.json'`
+      // Where is `package.json` in the project?
+      // We use it to determine the version of vue.
+      // It is relative to root property.
+      package: './package.json',
+      // **optional**
+      // Where is TypeScript config file in the project?
+      // It is relative to root property.
+      tsconfig: './src/client/tsconfig.json',
+      // **optional** default: `'./.vscode/vetur/snippets'`
+      // Where is vetur custom snippets folders?
+      snippetFolder: './.vscode/vetur/snippets',
+      // **optional** default: `[]`
+      // Register globally Vue component glob.
+      // If you set it, you can get completion by that components.
+      // It is relative to root property.
+      // Notice: It won't actually do it. You need to use `require.context` or `Vue.component`
+      globalComponents: [
+        './src/clients/components/global/*.vue'
+      ]
+    }
+  ]
+}