前言
今天接着上一篇electron的文章往下写。操作仍然是在win10下的powershell下进行的。主要记录element-ui的安装与使用。
安装并使用element-ui
安装
在项目根目录，执行如下命令完成element-ui的安装。
代码语言：javascript复制npm i element-ui -S
安装完之后，我们看项目根目录下的package.json，里面有dependencies和devDependencies，分别是开发环境和调试环境的依赖库。这时我们看到dependencies里已经有了element-ui这一项。
目录结构
上图中我们能看到目前状态的目录结构，重点关注以下几个。
package.json：应用的入口文件。其中的main字段表示的脚本是应用的启动脚本，缺省值是index.js。src/main：electron主进程。src/renderer：electron渲染进程，包含Vue的所有代码。
使用
安装完成之后，我们在src/render/main.js中引入element ui。
import Vue from 'vue'
import axios from 'axios'
import App from './App'
import router from './router'
import store from './store'
/* 添加如下三行，引入element-ui */
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
if (!process.env.IS_WEB) Vue.use(require('vue-electron'))
Vue.http = Vue.prototype.$http = axios
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
components: { App },
router,
store,
template: '<App/>'
}).$mount('#app')此后我们便可以在.vue文件中使用element ui元素了。
比如我们修改srcrenderercomponentsLandingPage.vue，添加一个button。
<el-button @click="message" type="success" icon="el-icon-search" round>一番码客</el-button>npm run dev运行，效果如下。
一番今日
长假第一天，在家看阅兵仪式。感叹国家的凝聚力和军事实力，科技是强国之道，科技的发展也是需要人文的推动，人还是核心的核心。
很庆幸自己的工作多少还是带点科技的色彩，如果下功夫，也可以在科技的专研上更进一步。
科技加上军人的坚毅与雷厉风行，真是提气又靓丽，一种令人向往的神气！
一直以来，做科研是一件坐冷板凳的事，在一生平凡的工作、生活中，保持好奇、保持热情，便会是不平凡的一生。
参考
- [electron-vue 集成 element-ui](https://blog.csdn.net/ucmir183/article/details/89277492)
- [Electron-vue实战—搭建项目与安装Element UI](https://www.cnblogs.com/suRimn/p/11101671.html)
- [文档|Electron](https://electronjs.org/docs)
