【Element-UI】解决el-icon图标显示不出来的问题

element-ui 图标icon的使用详见官网：
https://element.eleme.cn/#/en-US/component/icon

问题背景：
vue框架中使用element-ui，我的vue工程是使用脚手架创建的，是个vue webpack项目。

遇到的问题是：
在vue中加入elment-ui中的图标，但是页面上没有显示。页面部分代码为：

<el-menu-item index="/main">
     <i class="el-icon-menu"></i>
     <span slot="title">首页</span>
</el-menu-item>
<el-menu-item index="/page1">
     <i class="el-icon-s-order"></i>
     <span slot="title">标题1</span>
</el-menu-item>

可以看到，代码是没问题的，但是页面中就是没有显示图标，同时浏览器中的控制器也没有报错。

出错原因：
不显示的原因是项目中引入的element-ui的版本过低了，低版本的icon中没有代码中需要的图标。
比如我代码中使用的图标是<i class="el-icon-s-order"></i>，这个图标在低版本的element-ui中是没有的，所以显示不出来。需要在项目的package.json文件中更新一下element-ui的版本。
如图：

原来的版本是2.7.1，但是目前官网已经更新到2.8.2（你现在看这个帖子的时候可能又更新到其他版本了，按照官网的版本来）：

在package.json里面修改一下这个版本号，改成2.8.2，然后使用npm install重新更新一遍依赖包!!!
最后使用npm run dev运行项目，刷新一下页面，可以看到图标成功显示了：