ElementUI安装与使用指南

Element官网-安装指南

提醒一下:下面实例讲解是在Mac系统演示的;

一、开发环境配置

电脑需要先安装好node.js和vue2或者vue3

  1. 安装Node.js

Node.js 中文网

安装node.js命令:brew install node

node.js安装完后,输入:node -v , npm -v 查看对应的版本

  1. 安装vue.js

vue.js官网
vue2
Vue CLI官网 , Vue CLI是 Vue.js 开发的标准工具
提醒:Vue CLI 现已处于维护模式!

安装vue.js命令:npm install -g @vue/cli

vue 安装完后,输入:vue -V 或 vue --version 查看版本

二、vue创建工程

方式一:终端切换到自己电脑里保存工程的文件夹目录里, 然后输入:vue create 工程名称

方式二:终端里输入:vue ui

在浏览器里输入http://localhost:8000/project/select,打开Vue 项目管理器

点击在此创建新项目

点击下一步

点击下一步

点击创建项目

三、安装 element

终端里切换到工程目录,输入

四、查看element是否安装成功

方式一: 使用 Intellij IDEA 打开learnelementuispringboot

查看package.json

查看node_modules

方式二:使用HBuilderX打开learnelementuispringboot

查看package.json

查看node_modules

说明 element-ui已经安装好了

运行项目

方式一:Intellij IDEA

或者 Intellij IDEA 终端里输入:npm run serve

方式二:HBuilderX

项目启动成功页面:

点击下载learnelementuispringboot项目源码

learnelementuispringboot项目源码里有elementui使用实例

使用指南博客

以上就是ElementUI安装与使用指南的全部内容讲解。

相关推荐
tedcloud1231 分钟前
diagram-design 怎么安装?用 AI 自动生成更专业的架构图、流程图
linux·运维·前端·人工智能·开源·流程图
何智超2 分钟前
React 18 并发更新:高优先级先渲染,为什么最终状态不会算错?
前端
前端小万3 分钟前
两个半月的时间如何赚到 3000 块钱。
前端
YIAN4 分钟前
端侧大模型:DeepSeek-R1 WebGPU 推理全流程源码深度解析
前端·typescript·deepseek
请你吃div6 分钟前
个人 Nuxt4 博客 SEO 优化实战教程
前端·nuxt.js·seo
网安蟹佬霸12 分钟前
Android安全攻防实战:从APK逆向到Frida动态Hook全流程详解(附脚本)
android·前端·安全·web安全·逆向·csrf·网安
计算机魔术师22 分钟前
芯片不跌反涨?两家公司的赌局正在重塑全球算力格局
前端
IT_陈寒36 分钟前
Python多进程池的坑:子进程竟然不会退出
前端·人工智能·后端
snow@li37 分钟前
前端:全景深度分析/前端岗位起源,以及“美国没有前端岗位”的真相
前端
恋猫de小郭38 分钟前
Gradle 9.7.0 将提速 Android 构建,Sync 提升接近一倍
android·前端·flutter