直接给到找寻各种组件的网址:
https://element.eleme.cn/#/zh-CN/component/installation
安装ele ↓
npm install element-ui -S
main.js中引入ele ↓
import Element from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
Vue.use(Element);
在需要用到ele组件的地方直接使用即可。例如:
<el-button type="primary">默认按钮</el-button>
出现下图

tada~~
elementui在vue中使用成功~
接着可以尝试修改一下主题色。
在assets文件夹中的css里新建ele.scss文件 ↓
假设修改primary的颜色。在ele.scss文件中写 ↓
// theme color
$--color-primary: rgb(69, 137, 148);
//icon font path,require
$--font-path:"../../../node_modules/element-ui/lib/theme-chalk/fonts";
@import "../../../node_modules/element-ui/packages/theme-chalk/src/index";
在main.js中修改ele的引入 ↓
import Element from "element-ui";
import "./assets/css/ele.scss";
Vue.use(Element);


tada~~
主题色修改成功~
网友评论