ERROR TypeError: AutoImport is not a function

TypeError: AutoImport is not a function

原因:unplugin-auto-import 插件版本问题

Vue3基于Webpack,在vue.config.js中配置

  1. unplugin-vue-components版本小于0.26.0时,使用以下写法
javascript 复制代码
const { defineConfig } = require("@vue/cli-service")
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

module.exports = defineConfig({
  transpileDependencies: true,
  configureWebpack: {
    plugins: [
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
    ]
  }
})
  1. unplugin-vue-components版本大于等于0.26.0时,使用以下写法
javascript 复制代码
const { defineConfig } = require("@vue/cli-service")
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

module.exports = defineConfig({
  transpileDependencies: true,
  configureWebpack: {
    plugins: [
      AutoImport.default({
        resolvers: [ElementPlusResolver()],
      }),
      Components.default({
        resolvers: [ElementPlusResolver()],
      }),
    ]
  }
})
相关推荐
索西引擎3 小时前
【工程化】浅谈前端构建工具
前端·webpack·gulp·turbopack
随心点儿3 天前
vue2 webpack 部署二级目录、根目录nginx配置及打包配置调整
前端·nginx·webpack·根目录·二级目录
ZzMemory3 天前
一文分清前端常用包管理器以及构建工具
前端·面试·webpack
清岚_lxn3 天前
vue3 antd modal对话框里的前端html导出成pdf并下载
pdf·vue3·html2canvas·jspdf
炫饭第一名4 天前
Vue 2.5.16 + Webpack 4 升级 Vue 2.7.16 + Webpack 5 记录
前端·vue.js·webpack
断竿散人6 天前
前端救急实战:用 patch-package 解决 vue-pdf 电子签章不显示问题
前端·webpack·npm
Jokerator7 天前
Webpack插件开发深度指南:从原理到实战
webpack
伍哥的传说8 天前
Vue3 Anime.js超级炫酷的网页动画库详解
开发语言·前端·javascript·vue.js·vue·ecmascript·vue3
科技D人生8 天前
Vue.js 学习总结(18)—— Vue 3.6.0-alpha1:性能“核弹“来袭,你的应用准备好“起飞“了吗?!
前端·vue.js·vue3·vue 3.6·vue3.6
Komorebi_99999 天前
webpack相关
前端·webpack·node.js