irpas技术客

vue3+vite插件配置系列2-unplugin-auto-import_个人地址

网络投稿 7884

📝作用

解放双手,自动导入composition api 和 生成全局typescript说明

📝使用 🔖1.下载 npm i -D unplugin-auto-import 🔖2.vite.config.ts配置 import AutoImport from "unplugin-auto-import/vite" export default defineConfig({ plugins: [ ... AutoImport ({ imports: ["vue", "vue-router"], // 自动导入vue和vue-router相关函数 dts: "src/auto-import.d.ts" // 生成 `auto-import.d.ts` 全局声明 }) ] }) 🔖3.现在vue组件中可以直接使用composition api

before

<template> <button @click="add">add</button> <button @click="routerPush">go</button> {{count}} </template> <script lang="ts" setup> import { ref } from 'vue' import { useRouter } from 'vue-router' const count = ref(0) const router = useRouter() function add() { count.value++ } function routerPush(){ router.push('a') } </script>

after

<template> <button @click="add">add</button> <button @click="routerPush">go</button> {{count}} </template> <script lang="ts" setup> const count = ref(0) const router = useRouter() function add() { count.value++ } function routerPush(){ router.push('a') } </script>


1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,会注明原创字样,如未注明都非原创,如有侵权请联系删除!;3.作者投稿可能会经我们编辑修改或补充;4.本站不提供任何储存功能只提供收集或者投稿人的网盘链接。

标签: #API #