Vue3x+ElementPlus的按需引入

最新推荐文章于 2022-10-07 11:39:42 发布

伤心的咸鱼君

最新推荐文章于 2022-10-07 11:39:42 发布

阅读量313

点赞数

分类专栏：笔记文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/cspic/article/details/124701859

版权

笔记专栏收录该内容

4 篇文章 0 订阅

订阅专栏

在vue.config.js中

  configureWebpack: {
        plugins: [
            AutoImport({
              resolvers: [ElementPlusResolver()],
            }),
            Components({
              resolvers: [ElementPlusResolver()],
            })]
         }

然后在main.js中

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import { ElButton } from "element-plus";
createApp(App)
  .use(store)
  .use(router)
  .component(ElButton.name, ElButton)
  .use(ElementPlus)
  .mount("#app");

也可以在组件中单独引入

<template>
  <div id="app">
    <el-button type="primary">按钮</el-button>
  </div>
</template>
<script>
  import { ElButton } from 'element-plus'
  export default {
    components: { ElButton },
  }
</script>

目的是减少无效资源的加载和打包