Vue框架引入Element-Ui

首先已经创建好了 Vue 框架,安装好了 node.js。

没有完成的可按照此博客搭建:搭建Vue项目

之后打开终端,使用命令。

1、命令引入
复制代码
npm i element-ui -S
2、package.json 查看版本

在 package.json 文件里可查看下载好的依赖版本。

3、在 main.js 完整引入

没引入之前:

复制代码
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
Vue.config.productionTip = false
new Vue({
	router,
	store,
	render: h => h(App)
}).$mount('#app')

引入element-ui,增加3项:

复制代码
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.config.productionTip = false
Vue.use(ElementUI);

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
4、去 Element 官网复制代码测试

Element 官网

相关推荐
Asmewill4 分钟前
uv包管理命令
前端
发现一只大呆瓜6 分钟前
深入浅出 Tree Shaking:Rollup 是如何“摇”掉死代码的?
前端·性能优化·vite
weixin1997010801624 分钟前
《转转商品详情页前端性能优化实战》
前端·性能优化
钮钴禄·爱因斯晨32 分钟前
他到底喜欢我吗?赛博塔罗Java+前端实现,一键解答!
java·开发语言·前端·javascript·css·html
Watermelo61732 分钟前
理解 JavaScript 中的“ / ”:路径、资源与目录、nginx配置、请求、转义的那些事
前端·javascript·vue.js·chrome·nginx·正则表达式·seo
Beingchou1 小时前
HTML头部元信息避坑指南大纲
前端·html
jserTang1 小时前
手撕 Claude Code-4: TodoWrite 与任务系统
前端·javascript·后端
腹黑天蝎座2 小时前
大屏开发必读:Scale/VW/Rem/流式/断点/混合方案全解析(附完整demo)
前端·javascript
jserTang2 小时前
手撕 Claude Code-5:Subagent 与 Agent Teams
前端·javascript·后端
踩着两条虫2 小时前
VTJ.PRO的平台介绍与特性
前端·架构·ai编程