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

相关推荐
吃饺子不吃馅42 分钟前
如何设计一个 Canvas 事件系统?
前端·canvas·图形学
theOtherSky1 小时前
element+vue3 table上下左右键切换input和select
javascript·vue.js·elementui·1024程序员节
Baklib梅梅1 小时前
无头内容管理系统:打造灵活高效的多渠道内容架构
前端·ruby on rails·前端框架·ruby
over6971 小时前
浏览器里的AI魔法:用JavaScript玩转自然语言处理
前端·javascript
渣渣盟2 小时前
探索Word2Vec:从文本向量化到中文语料处理
前端·javascript·python·文本向量化
Pu_Nine_92 小时前
Vue 3 + TypeScript 项目性能优化全链路实战:从 2.1MB 到 130KB 的蜕变
前端·vue.js·性能优化·typescript·1024程序员节
云枫晖2 小时前
Webpack系列-Loader
前端·webpack
aggression2 小时前
代码敲击乐:让你了解前端的动静结合和移动端的适配性
前端
yinuo2 小时前
深入理解与实战 Git Submodule
前端
骑自行车的码农2 小时前
React 事件收集函数
前端·react.js