Element Plus快速开始（Vue 3.x）

一、环境支持

1. 需先安装好Vue 3.x
2. Element Plus 不再支持 IE 浏览器。
3. 支持以下浏览器版本：

Edge ≥ 79

Firefox ≥ 78

Chrome ≥ 64

Safari ≥ 12

二、安装

        （一）使用包管理器安装

# 选择一个你喜欢的包管理器

# NPM
$ npm install element-plus --save

# Yarn
$ yarn add element-plus

# pnpm
$ pnpm install element-plus

        （二）浏览器直接引入

                1、unpkg CDN提供商

                2、jsDelivr CDN提供商

三、快速上手（通过包管理器安装，配合打包工具）

        （一）完整引入

如果你对打包后的文件大小不是很在乎，那么使用完整导入会更方便。

// main.ts
import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'

const app = createApp(App)

app.use(ElementPlus)
app.mount('#app')

        （二）Volar 插件

如果您使用 Volar，请在 tsconfig.json 中通过 compilerOptions.type 指定全局组件类型。

// tsconfig.json
{
  "compilerOptions": {
    // ...
    "types": ["element-plus/global"]
  }
}

        （三）按需导入、自动导入、手动导入：略

        （四）快速搭建项目模板

                1、全局配置

在引入 Element Plus 时，可以传入一个包含 size 和 zIndex 属性的全局配置对象。 size 用于设置表单组件的默认尺寸，zIndex 用于设置弹出组件的层级，zIndex 的默认值为 2000。

完整引入：

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import App from './App.vue'

const app = createApp(App)
app.use(ElementPlus, { size: 'small', zIndex: 3000 })

按需引入：

                2、开始使用

您可以从现在起启动您的项目。 对于每个组件的用法，请参考单个组件对应的文档。