chore: simplify config

dishait · Feb 9, 2022 · b4f63aa · b4f63aa
1 parent 18be810
commit b4f63aa
Show file tree

Hide file tree

Showing 7 changed files with 15 additions and 170 deletions.
diff --git a/README.md b/README.md
@@ -23,13 +23,13 @@
 
 1. 安装
 ```shell
-npm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+npm i vite-auto-import-resolvers unplugin-auto-imports -D
 
 # pnpm 👇
-# pnpm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+# pnpm i vite-auto-import-resolvers unplugin-auto-imports -D
 
 # yarn 👇
-# yarn add @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+# yarn add vite-auto-import-resolvers unplugin-auto-imports -D
 ```
 
 2. 配置插件
@@ -38,23 +38,15 @@ npm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
 // vite.config.js
 // 或者 vite.config.ts
 
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        // 该别名是必需 👇
-        alias: {
-            '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver()
@@ -63,6 +55,7 @@ export default defineConfig({
     ]
 })
 ```
+
 3. 之后 `src/composables` 下模块的默认导出将在项目中自动按需引入
 
 例如 👇
@@ -94,7 +87,7 @@ export default 100
         // 其他配置
         "baseUrl": ".",
         "paths": {
-            "~/*": ["src/*"]
+            "/@fs/src/*": ["src/*"]
         }
     },
     // 其他配置
@@ -107,23 +100,15 @@ export default 100
 ### 强制前缀与后缀
 
 ```ts
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        // 该别名是必需 👇
-        alias: {
-            '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver({ prefix: 'use' }), // 强制前缀为 use
@@ -171,76 +156,18 @@ export default () => {
 <br />
 <br />
 
-### 其他风格路径别名
-
-你可能在项目中用其他风格的路径别名，例如 `@`
-
-那么你可以这样配置 👇
-
-```ts
-import { resolve } from 'path'
-import { defineConfig } from 'vite'
-import Vue from '@vitejs/plugin-vue'
-import AutoImports from 'unplugin-auto-import/vite'
-import { dirResolver } from 'vite-auto-import-resolvers'
-
-export default defineConfig({
-    resolve: {
-        alias: {
-            // 改变别名
-           '@/': `${resolve(__dirname, 'src')}/`
-        }
-    },
-    plugins: [
-        Vue(),
-        AutoImports({
-            dts: true,
-            imports: ['vue'],
-            resolvers: [
-                dirResolver({ srcAlias: '@' }) // 设置别名，默认为 ~
-            ]
-        })
-    ]
-})
-```
-
-如果你是 `ts` 的项目，`tsconfig.json` 理所当然也应该改 👇
-
-```json
-{
-    "compilerOptions": {
-        // 其他配置
-        "baseUrl": ".",
-        "paths": {
-            "@/*": ["src/*"]
-        }
-    },
-    // 其他配置
-}
-```
-
-<br />
-<br />
-
 ### 包含与排除
 
 ```ts
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        alias: {
-           '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver({ 

diff --git a/README_EN.md b/README_EN.md
@@ -25,13 +25,13 @@ In order to automatically import the `API` of modules in the specified directory
 1. install
 
 ```shell
-npm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+npm i vite-auto-import-resolvers unplugin-auto-imports -D
 
 # pnpm 👇
-# pnpm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+# pnpm i vite-auto-import-resolvers unplugin-auto-imports -D
 
 # yarn 👇
-# yarn add @types/node vite-auto-import-resolvers unplugin-auto-imports -D
+# yarn add vite-auto-import-resolvers unplugin-auto-imports -D
 ```
 
 2. Configure plugins
@@ -40,23 +40,15 @@ npm i @types/node vite-auto-import-resolvers unplugin-auto-imports -D
 // vite.config.js
 // OR vite.config.ts
 
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        // This alias is required 👇
-        alias: {
-            '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver()
@@ -96,7 +88,7 @@ If your project is `ts`, your `tsconfig.json` should have the following configur
         // other configs
         "baseUrl": ".",
         "paths": {
-            "~/*": ["src/*"]
+            "/@fs/src/*": ["src/*"]
         }
     },
     // other configs
@@ -110,22 +102,15 @@ If your project is `ts`, your `tsconfig.json` should have the following configur
 ### Mandatory prefix or mandatory suffix
 
 ```ts
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        alias: {
-            '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver({ prefix: 'use' }), // prefix use
@@ -142,7 +127,7 @@ export default defineConfig({
 So
 
 -  `src/composables`, only modules starting with `use` will be loaded on demand
-- `src/stores`, only modules ending in `store` will be loaded on demand
+- `src/stores`, only modules ending in `Store` will be loaded on demand
 
 for example 👇
 
@@ -173,76 +158,18 @@ export default () => {
 <br />
 <br />
 
-### Other style path aliases
-
-You may use other styles of path aliases in your project，for example `@`
-
-Then you can configure it like this 👇
-
-```ts
-import { resolve } from 'path'
-import { defineConfig } from 'vite'
-import Vue from '@vitejs/plugin-vue'
-import AutoImports from 'unplugin-auto-import/vite'
-import { dirResolver } from 'vite-auto-import-resolvers'
-
-export default defineConfig({
-    resolve: {
-        alias: {
-            // Change alias
-           '@/': `${resolve(__dirname, 'src')}/`
-        }
-    },
-    plugins: [
-        Vue(),
-        AutoImports({
-            dts: true,
-            imports: ['vue'],
-            resolvers: [
-                dirResolver({ srcAlias: '@' }) // Set alias, default to~
-            ]
-        })
-    ]
-})
-```
-
-If you are a project of `ts`, `tsconfig.json` should be changed 👇
-
-```json
-{
-    "compilerOptions": {
-        // other configs
-        "baseUrl": ".",
-        "paths": {
-            "@/*": ["src/*"]
-        }
-    },
-    // other configs
-}
-```
-
-<br />
-<br />
-
 ### include or exclude
 
 ```ts
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-    resolve: {
-        alias: {
-           '~/': `${resolve(__dirname, 'src')}/`
-        }
-    },
     plugins: [
         Vue(),
         AutoImports({
-            dts: true,
             imports: ['vue'],
             resolvers: [
                 dirResolver({ 

diff --git a/examples/vue/auto-imports.d.ts b/examples/vue/auto-imports.d.ts
@@ -2,7 +2,7 @@
 // We suggest you to commit this file into source control
 declare global {
   const computed: typeof import('vue')['computed']
-  const counterStore: typeof import('~/stores/counterStore')['default']
+  const counterStore: typeof import('/@fs/src/stores/counterStore')['default']
   const createApp: typeof import('vue')['createApp']
   const customRef: typeof import('vue')['customRef']
   const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
@@ -46,7 +46,7 @@ declare global {
   const useAttrs: typeof import('vue')['useAttrs']
   const useCssModule: typeof import('vue')['useCssModule']
   const useCssVars: typeof import('vue')['useCssVars']
-  const useFoo: typeof import('~/composables/useFoo')['default']
+  const useFoo: typeof import('/@fs/src/composables/useFoo')['default']
   const useSlots: typeof import('vue')['useSlots']
   const watch: typeof import('vue')['watch']
   const watchEffect: typeof import('vue')['watchEffect']

diff --git a/examples/vue/src/App.vue b/examples/vue/src/App.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-
     console.log(useFoo)
 
     const n = counterStore()

diff --git a/examples/vue/tsconfig.json b/examples/vue/tsconfig.json
@@ -14,7 +14,7 @@
 		"useDefineForClassFields": true,
 		"baseUrl": ".",
 		"paths": {
-			"~/*": ["src/*"]
+			"/@fs/src/*": ["src/*"]
 		}
 	},
 	"exclude": ["node_modules", "dist"]

diff --git a/examples/vue/vite.config.ts b/examples/vue/vite.config.ts
@@ -1,15 +1,9 @@
-import { resolve } from 'path'
 import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import AutoImports from 'unplugin-auto-import/vite'
 import { dirResolver } from 'vite-auto-import-resolvers'
 
 export default defineConfig({
-	resolve: {
-		alias: {
-			'~/': `${resolve(__dirname, 'src')}/`
-		}
-	},
 	plugins: [
 		Vue(),
 		AutoImports({