ElementUI搭建使用过程

1.ElementUI概述

Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库,相当于是css的框架

2.安装ElementUI

第一步:创建一个vue-cil项目

!!!(上篇文章已详细讲述搭建过程)

vue-cli搭建过程-CSDN博客

第二步:npm 安装

推荐使用 npm 的方式安装,它能更好地和 webpack打包工具配合使用

命令:npm i element-ui -S

第三步:导入ElementUI

在src目录下面找到main.js文件,导入ElementUI

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

第四步:测试是否成功

在ElementUI官方网址随便复制一个样式组件,粘贴到我们自己的组件上去

在控制台启动项目命令:npm run serve ,启动成功后,会出现访问项目地址,点开这样就是成功啦!!

相关推荐
别拿曾经看以后~5 分钟前
【el-form】记一例好用的el-input输入框回车调接口和el-button按钮防重点击
javascript·vue.js·elementui
我要洋人死8 分钟前
导航栏及下拉菜单的实现
前端·css·css3
川石课堂软件测试10 分钟前
性能测试|docker容器下搭建JMeter+Grafana+Influxdb监控可视化平台
运维·javascript·深度学习·jmeter·docker·容器·grafana
科技探秘人19 分钟前
Chrome与火狐哪个浏览器的隐私追踪功能更好
前端·chrome
科技探秘人20 分钟前
Chrome与傲游浏览器性能与功能的深度对比
前端·chrome
JerryXZR25 分钟前
前端开发中ES6的技术细节二
前端·javascript·es6
七星静香27 分钟前
laravel chunkById 分块查询 使用时的问题
java·前端·laravel
q24985969330 分钟前
前端预览word、excel、ppt
前端·word·excel
小华同学ai35 分钟前
wflow-web:开源啦 ,高仿钉钉、飞书、企业微信的审批流程设计器,轻松打造属于你的工作流设计器
前端·钉钉·飞书
problc40 分钟前
Flutter中文字体设置指南:打造个性化的应用体验
android·javascript·flutter