examples/vue-ts-example
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

refactor: Icons Type Declarations
All checks were successful
CI / cache-and-install (push) Successful in 1m26s
Details

Browse Source
This commit is contained in:
严浩
2024-08-27 17:20:31 +08:00
parent 04110516fa
commit b37ecb7251
5 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components.d.ts vendored
View File

@ -8,9 +8,9 @@ export {}
declare module 'vue' { declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
DefineRender: typeof import('./src/components/vue-macros/DefineRender.vue')['default'] DefineRender: typeof import('./src/components/vue-macros/DefineRender.vue')['default']
ICarbonFaceCool: typeof import('~icons/carbon/face-cool')['default'] IconCarbonFaceCool: typeof import('~icons/carbon/face-cool')['default']
Icons: typeof import('./src/components/Icons.vue')['default'] Icons: typeof import('./src/components/Icons.vue')['default']
ISvgPacman: typeof import('~icons/svg/pacman')['default'] IconSvgPacman: typeof import('~icons/svg/pacman')['default']
ReactivityTransform: typeof import('./src/components/vue-macros/ReactivityTransform.vue')['default'] ReactivityTransform: typeof import('./src/components/vue-macros/ReactivityTransform.vue')['default']
ReusableTemplate: typeof import('./src/components/ReusableTemplate.vue')['default'] ReusableTemplate: typeof import('./src/components/ReusableTemplate.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink'] RouterLink: typeof import('vue-router')['RouterLink']

8
src/components/Icons.vue
View File

@ -9,7 +9,7 @@
<div b="1px solid pink"> <div b="1px solid pink">
<div>Icons({ autoInstall: true })</div> <div>Icons({ autoInstall: true })</div>
<i-carbon-face-cool class="text-yellow" w-32 h-32 /> <icon-carbon-face-cool class="text-yellow" w-32 h-32 />
</div> </div>
<div b="1px solid pink"> <div b="1px solid pink">
@ -19,12 +19,12 @@
<div b="1px solid pink"> <div b="1px solid pink">
<div>pacman.svg</div> <div>pacman.svg</div>
<!-- FIXME: [unocss] failed to load icon "svg-pacman" --> <icon-svg-pacman text-blue w-48 h-48 />
<i-svg-pacman text-blue w-48 h-48 /> <some-icon text-cyan w-48 h-48 />
</div> </div>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
// import SomeIcon from '~icons/svg/pacman';
</script> </script>

1
src/components/vue-macros/ReactivityTransform.vue
View File

@ -1,4 +1,5 @@
<script setup> <script setup>
// https://vue-macros.dev/zh-CN/features/reactivity-transform.html
let count = $ref(0); let count = $ref(0);
console.log(count); console.log(count);

2
src/types/env.d.ts vendored
View File

@ -1,4 +1,4 @@
/// <reference types="vite/client" /> /// <reference types="vite/client" />
/// <reference types="unplugin-vue-router/client" /> /// <reference types="unplugin-vue-router/client" />
/* /// <reference types="@vue-macros/reactivity-transform/macros-global" /> */
/// <reference types="unplugin-vue-macros/macros-global" /> /// <reference types="unplugin-vue-macros/macros-global" />
/// <reference types="unplugin-icons/types/vue" />

3
vite.config.ts
View File

@ -2,7 +2,6 @@ import { unheadVueComposablesImports } from '@unhead/vue';
import { VantResolver } from '@vant/auto-import-resolver'; import { VantResolver } from '@vant/auto-import-resolver';
import Vue from '@vitejs/plugin-vue'; import Vue from '@vitejs/plugin-vue';
import VueJsx from '@vitejs/plugin-vue-jsx'; import VueJsx from '@vitejs/plugin-vue-jsx';
import ReactivityTransform from '@vue-macros/reactivity-transform/vite';
import { fileURLToPath, URL } from 'node:url'; import { fileURLToPath, URL } from 'node:url';
import UnoCSS from 'unocss/vite'; import UnoCSS from 'unocss/vite';
import AutoImport from 'unplugin-auto-import/vite'; import AutoImport from 'unplugin-auto-import/vite';
@ -69,7 +68,6 @@ function Plugins() {
}), // https://vue-macros.dev/zh-CN/guide/bundler-integration.html }), // https://vue-macros.dev/zh-CN/guide/bundler-integration.html
UnoCSS(), UnoCSS(),
Markdown({ headEnabled: true }), Markdown({ headEnabled: true }),
ReactivityTransform(), // https://vue-macros.dev/zh-CN/features/reactivity-transform.html
); );
plugins.push( plugins.push(
@ -92,6 +90,7 @@ function Plugins() {
include: [/\.vue$/, /\.vue\?vue/, /\.md$/], include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
resolvers: [ resolvers: [
IconsResolver({ IconsResolver({
prefix: 'icon',
customCollections: ['svg'], customCollections: ['svg'],
}), // https://github.com/unplugin/unplugin-icons?tab=readme-ov-file#auto-importing }), // https://github.com/unplugin/unplugin-icons?tab=readme-ov-file#auto-importing
TDesignResolver({ library: 'mobile-vue', esm: true }), TDesignResolver({ library: 'mobile-vue', esm: true }),