关于Vue3脚手架如何按需引入elementplus

最新推荐文章于 2024-03-10 00:00:00 发布

牛马程序员666

最新推荐文章于 2024-03-10 00:00:00 发布

阅读量178

点赞数 1

本文链接：https://blog.csdn.net/a820206256/article/details/128676782

版权

文章目录

关于Vue3脚手架如何按需引入elementplus

博主刚学习vue脚手架的时候，根据官网的配置老是出错，也许是博主太菜了。不过博主已经掌握了一种引入一次就能成功的方法。下面就分享给大家！

1. 安装

# NPM
npm install element-plus --save

# Yarn
yarn add element-plus

2. 自动导入

npm install -D unplugin-vue-components unplugin-auto-import

3. 配置

// vue.config.js

const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

4.继续配置

// vue.config.js


module.exports = defineConfig({
	transpileDependencies: true,
	
	    //引入elmentplus
    configureWebpack: config => {
        config.plugins.push(AutoImport({
            resolvers: [ElementPlusResolver()],
        }))
        config.plugins.push(Components({
            resolvers: [ElementPlusResolver()],
        }))
    },
})

此时咱们就可以导入一个按钮到页面上看成果啦！收！