自学内容网 自学内容网

vue3 开发利器——unplugin-auto-import

这玩意儿是干啥的?

还记得 Vue 3 的组合式 API 语法吗?如果有印象,那你肯定对以下代码有着刻入 DNA 般的熟悉:


刚开始写觉得没什么,但是后来渐渐发现,这玩意儿几乎每个页面都有啊!

每次都要写,哪怕是复制粘贴都会非常繁琐。并且每一个 <script setup> 下面都顶着一大坨 import,看着也十分难受。

本文介绍的 unplugin-auto-import 就是为了解决这个问题而诞生的。

unplugin-auto-import 官方简介:

为 Vite、Webpack、Rollup 和 esbuild 按需自动导入 API。支持 TypeScript。由 unplugin 提供技术支持。

安装:

// 安装unplugin-auto-import
npm install unplugin-auto-import -D

vite.config.js

// vite.config.js 配置文件
import { defineConfig } from 'vite';
import AutoImport from 'unplugin-auto-import/vite';
 
export default defineConfig({
  plugins: [
    AutoImport({
      imports: ['vue'],
      dts: 'src/auto-imports.d.ts',
    }),
  ],
});

使用

// 现在你可以在任何组件中直接使用Vue的功能,例如:
// 不需要import { ref } from 'vue'
const count = ref(0);


原文地址:https://blog.csdn.net/liming1016/article/details/144077194

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!