当前位置: 首页 > article >正文

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);


http://www.kler.cn/a/413649.html

相关文章:

  • 【Linux】剧幕中的灵魂更迭:探索Shell下的程序替换
  • MySQL 中的排序:索引排序与文件排序
  • 双十一线上服务调用链路追踪SkyWalking实战分析
  • Flutter:启动屏逻辑处理02:启动页
  • femor 第三方Emby应用全平台支持v1.0.54更新
  • Vue.js --- 生命周期
  • React Hooks中use的细节
  • 【探寻密码的奥秘】-001:解开密码的神秘面纱
  • Spring MVC:原理、配置与基础应用详解
  • 【人工智能】Python常用库-Scikit-learn常用方法教程
  • 泷羽sec学习打卡-shell命令2
  • 【webrtc】 mediasoup中m77的IntervalBudget及其在AlrDetector的应用
  • Day3 苍穹外卖项目 公共字段自动填充(AOP)、文件上传、新增菜品、菜品分页查询、删除菜品、修改菜品
  • 【linux】手搓线程池
  • 彻底理解微服务的作用和解决方案
  • JS听到了替罪的回响
  • Flink 之 Window 机制详解(上):基础概念与分类
  • java基础知识(Arrays类)
  • Java爬虫:深入解析商品详情的利器
  • 基于Springboot的流浪宠物管理系统
  • Vue.js 中 v-for 指令与 JavaScript 数组方法
  • Nvidia的hami是什么,以及如何再K8S中起作用
  • Zookeeper3.5.8集群部署
  • 数据库---HSQLDB使用教程详解
  • 什么是虚拟机栈
  • 200. 岛屿数量【 力扣(LeetCode) 】