前言

今天应老大的要求，安装一下iview-project，作为下一个项目的ui组件库，在安装过程中发现了一些问题。接下来就好好的梳理一下。

什么是iView？

iView 是一套基于 Vue.js 的开源 UI 组件库，主要服务于 PC 界面的中后台产品。

iView组件库很丰富，UI精致，而且是vue好伙伴，使用上来说，可以很大程度上提高开发效率。
阿里巴巴、腾讯、京东、滴滴都在用。

环境搭建

安装node.js

无论是使用Vue还是Webpack，都需要安装node.js，在安装node同时npm也会跟着一同安装。
首先，从node.js官网官网下载对应平台的安装程序，mac os直接安装即可。
安装好后，测试一下。

//测试node
$ node -v
这里出现版本号
//测试npm
$ npm -v
这里出现版本号

npm安装起来时间会很久，所以有需要的朋友可以自行安装淘宝镜像，这里就不详解了。

下载iview-project

需要的环境已经搭建好了，接下来就进行项目工程的安装。
我们需要到github去下载iview-project的所有文件。
我们可以从iview官网进，也可以直接打开这个网址下载

https://github.com/iview/iview-project

如果你有git的话，可以直接使用命令行

git clone https://github.com/iview/iview-project.git 克隆下载

如果没有的话，可以直接下载ZIP到自己电脑，在进行解压

安装依赖

下载完成后，我们打开文件iview-project3.0，在文件根目录下打开命令行窗口
如果你下载了git，可以直接在文件根目录下右键，选择gitBush，打开命令窗口
如果你没有下载git，可以在文件根目录下按住shift键，在右键，选择在此处打开命令窗口

首先需要安装一个webpack的全局,在命令窗口输入

npm install webpack –g

安装完成后，需要安装webpack-cli的全局，接着输入

npm install webpack –cli –g

这两步完成后，可以安装依赖了，继续输入

npm install

安装依赖完成后，会有一些报错，就是150漏洞，这些漏洞都是iview-project贡献者上传代码导致的，目前这些漏洞有什么问题还不清楚，但是不影响我们的使用。

接下来打开文件根目录下的 webpack.dev.config.js 文件，找到

fs.open('./src/config/env.js', 'w', function (err, fd) {
    const buf = 'export default "development";';
    fs.write(fd, buf, 0, buf.length, 0, function (err, written, buffer){});
});

更改为

fs.open('./src/config/env.js', 'w', function (err, fd) {
    const buf = 'export default "development";';
    fs.write(fd, buf, 0, 'utf-8', function(err, written, buffer) {});
});

这个时候运行会报错，因为这个项目工程还没有创建index.html，所以我们需要先创建index.html
在命令窗口输入

npm run init

创建完成后，就可以输入

npm run dev

就可以打开运行项目了。
当你的项目完成后，可以输入

npm run build

进行项目打包。

总结

在安装iview-project过程中，我一直运行不了项目。我一开始认为是那些漏洞导致的，就尝试着修改漏洞，有142个可以通过npm aduit fix自动修复。还有8个漏洞需要手动修复。前前后后修复漏洞花的时间比较长，修复完后才发现不是漏洞问题(有点想哭)。后面才一直不断的尝试，才发现是webpack没有安装，安装后以为大功告成，没想到还要修改webpack.dev.config.js文件。虽然安装花费时间比较多，但是也学到了。希望以后的人安装可以少走弯路了。