element-plus在vue3.0中按需自动导入

最新推荐文章于 2024-10-10 09:41:43 发布

TE杨

最新推荐文章于 2024-10-10 09:41:43 发布

阅读量2.5k

点赞数 1

分类专栏： vue 文章标签： vue.js webpack javascript

本文链接：https://blog.csdn.net/wron_path/article/details/122997929

版权

vue 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

一、引入element-plus

//三种引入方式
# NPM
$ npm install element-plus --save

# Yarn
$ yarn add element-plus

# pnpm
$ pnpm install element-plus

二、安装`unplugin-vue-components` 和 `unplugin-auto-import`这两款插件

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

三、`Webpack`配置

手动创建vue.config.js文件

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

module.exports = {
    publicPath:'./',
    configureWebpack: {
        // ...
        plugins: [
            AutoImport({
                resolvers: [ElementPlusResolver()],
            }),
            Components({
                resolvers: [ElementPlusResolver()],
            }),
        ],
    }
}