elementui配置(element配置)

vue elementui 配置

第一步：安装elementui

node命令：npm i element-ui -S

第二步：在man.js中配置

import ElementUI from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css';

Vue. use( ElementUI)

Vue. config. productionTip = false

举例如:空项目时候，man.js文件代码为

// The Vue build version to load with the `import` command

// (runtime-only or standalone) has been set in webpack.base.conf with an alias.

import Vue from 'vue'

import App from './App'

import router from './router'

import ElementUI from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css';

Vue. use( ElementUI)

Vue. config. productionTip = false

/* eslint-disable no-new */

new Vue({

el: '#app',

router,

components: { App },

template: ''

})

之后就可以在你的组件使用官方elementUI组件了。

使用举例：

< template >

< div class= "c-container" >

< div class= "my-form" >

< el-input v-model=" input" placeholder= "请输入内容" > el-input >

div >

div >

template >

< style lang= "less" scoped >

.c-container{

width: 100%;

font-size: 4vw;

.my-form{

width: 90%;

margin: 0 auto;

}

}

style >

< script >

export default {

data() {

return {

input: ''

}

}

}

script >