diff --git a/package.json b/package.json
index 949e5c54..770ccea2 100644
--- a/package.json
+++ b/package.json
@@ -19,8 +19,8 @@
   ],
   "scripts": {
     "dev": "npm run build -- --watch",
-    "example:dev": "npm -C example run dev",
-    "example:build": "npm -C example run build",
+    "example:dev": "npm -C example/basic run dev",
+    "example:build": "npm -C example/basic run build",
     "build": "tsup src/index.ts --dts --format cjs,esm",
     "prepublishOnly": "npm run build",
     "release": "npx git-ensure -a && npx bumpp --commit --tag --push"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3a2b0526..4b25109c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -33,6 +33,42 @@ importers:
       tsup: ^4.2.0
       typescript: ^4.1.5
       vite: ^2.0.2
+  ../../../../../../../i/vite-plugin-components:
+    dependencies:
+      chokidar: 3.5.1
+      debug: 4.3.2
+      fast-glob: /@knightly/fast-glob/3.2.5-knightly-master.202101180131
+      minimatch: 3.0.4
+    devDependencies:
+      '@antfu/eslint-config': 0.4.3_eslint@7.20.0+typescript@4.1.5
+      '@types/debug': 4.1.5
+      '@types/minimatch': 3.0.3
+      '@types/node': 14.14.31
+      '@typescript-eslint/eslint-plugin': 4.15.2_eslint@7.20.0+typescript@4.1.5
+      eslint: 7.20.0
+      rollup: 2.39.1
+      standard-version: 9.1.1
+      tsup: 4.2.0_typescript@4.1.5
+      typescript: 4.1.5
+      vite: 2.0.2
+    specifiers:
+      '@antfu/eslint-config': ^0.4.3
+      '@types/debug': ^4.1.5
+      '@types/minimatch': ^3.0.3
+      '@types/node': ^14.14.31
+      '@typescript-eslint/eslint-plugin': ^4.15.2
+      chokidar: ^3.5.1
+      debug: ^4.3.2
+      eslint: ^7.20.0
+      fast-glob: npm:@knightly/fast-glob@master
+      minimatch: ^3.0.4
+      rollup: ^2.39.1
+      standard-version: ^9.1.1
+      tsup: ^4.2.0
+      typescript: ^4.1.5
+      vite: ^2.0.2
+  ../../.nvm/versions/node/v15.9.0/pnpm-global:
+    specifiers: {}
   example/basic:
     dependencies:
       vant: 3.0.6_vue@3.0.5
@@ -162,7 +198,7 @@ packages:
       '@babel/traverse': 7.13.0
       '@babel/types': 7.13.0
       convert-source-map: 1.7.0
-      debug: 4.3.2
+      debug: 4.3.1
       gensync: 1.0.0-beta.2
       json5: 2.2.0
       lodash: 4.17.21
@@ -339,7 +375,7 @@ packages:
       '@babel/helper-split-export-declaration': 7.12.13
       '@babel/parser': 7.13.4
       '@babel/types': 7.13.0
-      debug: 4.3.2
+      debug: 4.3.1
       globals: 11.12.0
       lodash: 4.17.21
     dev: true
@@ -355,7 +391,7 @@ packages:
   /@eslint/eslintrc/0.3.0:
     dependencies:
       ajv: 6.12.6
-      debug: 4.3.2
+      debug: 4.3.1
       espree: 7.3.1
       globals: 12.4.0
       ignore: 4.0.6
@@ -495,7 +531,7 @@ packages:
       '@typescript-eslint/experimental-utils': 4.15.2_eslint@7.20.0+typescript@4.1.5
       '@typescript-eslint/parser': 4.15.2_eslint@7.20.0+typescript@4.1.5
       '@typescript-eslint/scope-manager': 4.15.2
-      debug: 4.3.2
+      debug: 4.3.1
       eslint: 7.20.0
       functional-red-black-tree: 1.0.1
       lodash: 4.17.21
@@ -519,7 +555,7 @@ packages:
     dependencies:
       '@typescript-eslint/experimental-utils': 4.15.2_eslint@7.20.0+typescript@4.1.5
       '@typescript-eslint/scope-manager': 4.15.2
-      debug: 4.3.2
+      debug: 4.3.1
       eslint: 7.20.0
       functional-red-black-tree: 1.0.1
       lodash: 4.17.21
@@ -561,7 +597,7 @@ packages:
       '@typescript-eslint/scope-manager': 4.15.2
       '@typescript-eslint/types': 4.15.2
       '@typescript-eslint/typescript-estree': 4.15.2_typescript@4.1.5
-      debug: 4.3.2
+      debug: 4.3.1
       eslint: 7.20.0
       typescript: 4.1.5
     dev: true
@@ -594,7 +630,7 @@ packages:
     dependencies:
       '@typescript-eslint/types': 4.15.2
       '@typescript-eslint/visitor-keys': 4.15.2
-      debug: 4.3.2
+      debug: 4.3.1
       globby: 11.0.2
       is-glob: 4.0.1
       semver: 7.3.4
@@ -1972,6 +2008,7 @@ packages:
   /debug/4.3.2:
     dependencies:
       ms: 2.1.2
+    dev: false
     engines:
       node: '>=6.0'
     peerDependencies:
@@ -2425,7 +2462,7 @@ packages:
       ajv: 6.12.6
       chalk: 4.1.0
       cross-spawn: 7.0.3
-      debug: 4.3.2
+      debug: 4.3.1
       doctrine: 3.0.0
       enquirer: 2.3.6
       eslint-scope: 5.1.1
@@ -5007,7 +5044,7 @@ packages:
       integrity: sha512-X+PTIPRt6/5Odf/h0kBkwkck+YC0I6oKH5+ttA9ytoLyC9yeksktVq1KNzImqB+/1CNBiBE2vr7orcgSxAi67w==
   /vue-eslint-parser/7.5.0_eslint@7.20.0:
     dependencies:
-      debug: 4.3.2
+      debug: 4.3.1
       eslint: 7.20.0
       eslint-scope: 5.1.1
       eslint-visitor-keys: 1.3.0
diff --git a/src/context.ts b/src/context.ts
index 3f6e245a..76057b75 100644
--- a/src/context.ts
+++ b/src/context.ts
@@ -1,4 +1,4 @@
-import { relative, resolve } from 'path'
+import { relative } from 'path'
 import Debug from 'debug'
 import chokidar from 'chokidar'
 import { ResolvedConfig, UpdatePayload, ViteDevServer } from 'vite'
@@ -24,7 +24,7 @@ export class Context {
     options: Options,
     public readonly viteConfig: ResolvedConfig,
   ) {
-    this.options = resolveOptions(options)
+    this.options = resolveOptions(options, viteConfig)
     const { globs, dirs } = this.options
 
     if (viteConfig.command === 'serve') {
diff --git a/src/types.ts b/src/types.ts
index 4ee7b874..f9671f52 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -82,6 +82,7 @@ Required<Options>,
   libraries: UILibraryOptions[]
   extensions: string[]
   dirs: string[]
+  resolvedDirs: string[]
   globs: string[]
 }
 
diff --git a/src/utils.ts b/src/utils.ts
index 63c0e553..7192dda7 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -1,4 +1,4 @@
-import { join, parse } from 'path'
+import { join, parse, resolve } from 'path'
 import minimatch from 'minimatch'
 import { ResolvedConfig } from 'vite'
 import { ComponentInfo, ResolvedOptions, Options } from './types'
@@ -75,7 +75,7 @@ export function stringifyComponentImport({ name, path, importName }: ComponentIn
     return `import ${name} from '${path}'`
 }
 
-export function resolveOptions(options: Options): ResolvedOptions {
+export function resolveOptions(options: Options, viteConfig: ResolvedConfig): ResolvedOptions {
   const resolved = Object.assign({}, defaultOptions, options) as ResolvedOptions
   resolved.libraries = toArray(resolved.libraries).map(i => typeof i === 'string' ? { name: i } : i)
   resolved.customComponentResolvers = toArray(resolved.customComponentResolvers)
@@ -87,6 +87,7 @@ export function resolveOptions(options: Options): ResolvedOptions {
     : `{${resolved.extensions.join(',')}}`
 
   resolved.dirs = toArray(resolved.dirs)
+  resolved.resolvedDirs = resolved.dirs.map(i => resolve(viteConfig.root, i))
 
   resolved.globs = resolved.dirs.map(i =>
     resolved.deep
@@ -101,14 +102,14 @@ export function resolveOptions(options: Options): ResolvedOptions {
 }
 
 export function getNameFromFilePath(filePath: string, options: ResolvedOptions): string {
-  const { dirs, directoryAsNamespace, globalNamespaces } = options
+  const { resolvedDirs, directoryAsNamespace, globalNamespaces } = options
 
   const parsedFilePath = parse(filePath)
 
   let strippedPath = ''
 
   // remove include directories from filepath
-  for (const dir of dirs) {
+  for (const dir of resolvedDirs) {
     if (parsedFilePath.dir.startsWith(dir)) {
       strippedPath = parsedFilePath.dir.slice(dir.length)
       break