elementui require
ElementUI 引入方式
ElementUI 可以通过多种方式引入到项目中,具体选择取决于项目需求和开发环境。
npm 安装
适用于 Vue.js 项目,通过 npm 或 yarn 安装 ElementUI 依赖:
npm install element-ui -S
# 或
yarn add element-ui
安装完成后,在项目中引入 ElementUI:

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
CDN 引入
适用于快速原型开发或非构建工具环境,通过 CDN 引入 ElementUI:
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
按需引入

适用于优化项目体积,仅引入需要的组件:
import Vue from 'vue';
import { Button, Select } from 'element-ui';
import 'element-ui/lib/theme-chalk/button.css';
import 'element-ui/lib/theme-chalk/select.css';
Vue.use(Button);
Vue.use(Select);
主题定制
可以通过覆盖默认主题变量或使用在线主题生成工具定制主题:
import Vue from 'vue';
import ElementUI from 'element-ui';
import './theme/index.css'; // 自定义主题文件
Vue.use(ElementUI);
注意事项
- 确保项目已安装 Vue.js 2.x 版本,ElementUI 不支持 Vue 3。
- 按需引入需要配置 babel-plugin-component 插件。
- CDN 引入方式可能导致加载速度受网络影响。






