Rancher/ui nodejs框架调试部署

有些日子没有更新博客了，大伙可能会问最近在忙什么？哈哈，当然是忙工作了！最近在研究rancher平台。近期的业内新闻中也有SUSE收购了Rancher，在10月份的时候会完成全部收购流程，rancher平台是什么就不在这里介绍了，如果有不知道的可以Baidu一下。

言归正传：

在github上面Rancher/UI项目中看到在UI打包之前可以对其进行修改调整，便按照github上面的操作步骤操练起来，但过程并没有github上面那么简单。经过一番折腾搞出来了，在此记录一下整个过程，也分享给需要的伙伴。

项目github地址：https://github.com/rancher/ui

操作步骤说明

1.编译运行基础环境

(安装新版本nodjs可以参考：https://www.jianshu.com/p/e9db0baf781b)

npm config set registry=https://registry.npm.taobao.org

yarn config set registry https://registry.npm.taobao.org

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

yum -y install gcc+ gcc-c++

2.编译rancher-ui

git clone 'https://github.com/rancher/ui'

cd 'ui'

git init

npm install

yarn upgrade

./scripts/update-dependencies

3.运行

RANCHER="https://rancher-server" yarn start

RANCHER="https://192.168.0.1" yarn start

rancher-server是已经启动的rancher管理平台的地址，这里我以192.168.0.1举例，自己做的时候要改为实际的服务地址。到此整个过程就结束了？当然没了结束，如果这样，也不至于折腾了。下面说说问题吧

1.运行./scripts/update-dependencies时会报缺少包，正常会自动下载，如果缺少需要手动安装。

如：npm -i node-sass --save

2.运行RANCHER="https://rancher-server" yarn start会提示“无法找到/ui/vendor/icons/variables.scss”。转到目录下发现icons目录是空的，但在github上面这个目录下是有文件的，使用clone和zip的方式下载，发现icons目录就是为空，没办法，只能把icons目录从github上面下载了，再把文件上传到服务器后，再执行RANCHER="https://rancher-server" yarn start。

3.RANCHER="https://rancher-server" 正常启动后使用https://localhost:8000 启动登录界面，发现无法登录显示"未授权"，通过浏览器开发者模式查看，发现ui-pl，first-login等加载项为401，认为是Apiserver有问题，在平台查看后发现有对应的关系。开始查找github上面的wiki无果后，感觉授权应该docker启动平台时定义。采用以下命令创建平台：

docker run -d --restart=unless-stopped \

--net="host" \

--restart always \

-v /etc/docker/certs.d/local.com:/container/certs \

-e SSL_CERT_DIR="/container/certs" \

--name rancher \

rancher/rancher:latest

之后再运行RANCHER="https://rancher-server" 访问https://localhost:8000 可以正常登录了。

最后放一个完成的截图