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 官网

相关推荐
@大迁世界5 分钟前
1.什么是 ReactJS?
前端·javascript·react.js·前端框架·ecmascript
BJ-Giser1 小时前
Cesium 基于EZ-Tree的植被效果
前端·可视化·cesium
王码码20352 小时前
Flutter for OpenHarmony:Flutter 三方库 algoliasearch 毫秒级云端搜索体验(云原生搜索引擎)
android·前端·git·flutter·搜索引擎·云原生·harmonyos
发现一只大呆瓜2 小时前
深入浅出 AST:解密 Vite、Babel编译的底层“黑盒”
前端·面试·vite
左手厨刀右手茼蒿2 小时前
Flutter for OpenHarmony: Flutter 三方库 shamsi_date 助力鸿蒙应用精准适配波斯历法(中东出海必备)
android·flutter·ui·华为·自动化·harmonyos
天天鸭2 小时前
前端仔写了个 AI Agent,才发现大模型只干了 10% 的活
前端·python·ai编程
发现一只大呆瓜2 小时前
前端模块化:CommonJS、AMD、ES Module三大规范全解析
前端·面试·vite
IT_陈寒2 小时前
一文搞懂JavaScript的核心概念
前端·人工智能·后端
IT_陈寒3 小时前
Java开发者必看!5个提升开发效率的隐藏技巧,你用过几个?
前端·人工智能·后端
前端Hardy3 小时前
Wails v3 正式发布:用 Go 写桌面应用,体积仅 12MB,性能飙升 40%!
前端·javascript·go