制作流动特效个人主页

一个非常非常炫酷的个人主页项目！

项目地址：https://github.com/Tomotoes/HomePage

访问GitHub项目

预览

预览主页

或是通过iframe预览：

教程

安装所需环境

项目所需环境为Nodejs 6.0以上版本,Git;

• 安装Nodejs:https://nodejs.org/en
• 安装Git:https://git.p2hp.com/

一路傻瓜式的安装，一直点确定就可以了。

安装cnpm

cnpm是国内npm的镜像包。在这个项目中，用npm会出现奇奇怪怪的问题，所以这里我们选择用cnpm：

在桌面上右键，选择git bash here，执行命令：

npm install cnpm -g --registry=https://registry.npm.taobao.org

即可完成安装。如在过程中遇到问题，参见：

• https://www.jianshu.com/p/fbd87ad45631
• https://www.oschina.net/p/cnpm?hmsr=aladdin1e1
• https://npmmirror.com/

安装项目

在合适的地方（这里以桌面为例）。右键，选择git bash here,执行命令：

git clone https://github.com/Tomotoes/HomePage.git

这时桌面上会出现一个名为HomePage的文件夹。

修改错误并安装

项目有些地方有出错，接下来需要我们手动修改：
进入HomePage文件夹,找到package.json文件，将其中的node-sass和gulp-sass所在行全部删掉。
回到HomePage文件夹，右键选择git bash here，分别执行命令：

cnpm install node-sass --save-dev

cnpm install gulp-sass --save-dev

再找到gulpfile.js文件，将第12行改成这个：

const sass = require('gulp-sass')(require('sass'))

然后回到HomePage文件夹，右键选择git bash here，执行命令：

cnpm install sass --save-dev

cnpm install

至此，项目安装完成。

启动、预览和部署

在HomePage文件夹下执行以下命令以启动预览：

cnpm run dev

在HomePage文件夹下执行以下命令以启动构建：

cnpm run build

构建完之后dist文件夹里的静态文件，即可上传至服务器完成部署。

配置

修改HomePage文件夹下的config.json文件来完成个人信息定制。

更多信息请参见项目文档：https://github.com/Tomotoes/HomePage