Thingsboard 编译前端 ui-ngx 踩坑记录

  1. 在 IDEA 中进行 mvn clean install -Dmaven.test.skip=true 进行编译,在 ui-ngx 模块报错。
    [INFO] -----------------------< org.thingsboard:ui-ngx >-----------------------
    [INFO] Building ThingsBoard Server UI 3.3.0                              [1/15]
    [INFO] --------------------------------[ jar ]---------------------------------
    [INFO] 
    [INFO] --- maven-clean-plugin:2.5:clean (default-clean) @ ui-ngx ---
    [INFO] Deleting D:\IDEA-workspace\iot\thingsboard\ui-ngx\target
    [INFO] 
    [INFO] --- frontend-maven-plugin:1.12.0:install-node-and-yarn (install node and npm) @ ui-ngx ---
    [INFO] Installing node version v12.16.1
    [INFO] Copying node binary from C:\Users\付康\.m2\repository\com\github\eirslett\node\12.16.1\node-12.16.1-win-x64.exe to D:\IDEA-workspace\iot\thingsboard\ui-ngx\target\node\node.exe
    [INFO] Installed node locally.
    [INFO] Installing Yarn version v1.22.4
    [INFO] Unpacking C:\Users\付康\.m2\repository\com\github\eirslett\yarn\1.22.4\yarn-1.22.4.tar.gz into D:\IDEA-workspace\iot\thingsboard\ui-ngx\target\node\yarn
    [INFO] Installed Yarn locally.
    [INFO] 
    [INFO] --- frontend-maven-plugin:1.12.0:yarn (yarn install) @ ui-ngx ---
    [INFO] Running 'yarn install' in D:\IDEA-workspace\iot\thingsboard\ui-ngx
    [INFO] yarn install v1.22.4
    [INFO] warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
    [INFO] [1/4] Resolving packages...
    [INFO] [2/4] Fetching packages...
    [INFO] error Command failed.
    [INFO] error Command failed.info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
    [INFO] Exit code: 128
    [INFO] Command: git
    [INFO] Arguments: ls-remote --tags --heads git://github.com/thingsboard/flot.git
    [INFO] Directory: D:\IDEA-workspace\iot\thingsboard\ui-ngx
    [INFO] Output:
    [INFO] fatal: unable to connect to github.com:
    [INFO] github.com[0: 140.82.112.4]: errno=Unknown error
    
    
  2. 首先排查 github.com 域名解析,通过 https://ipaddress.com/website/github.com 获取最新 ip 并写入 hosts 文件。【无效】
  3. 日志中出现 git://github.com/thingsboard/flot.git ,查看文件发现其中三个依赖组件是 git://xxx.git 格式,经查资料已经被 github 禁用了,需要转换为 https://
    git config --global url."https://".insteadOf git://
    
    执行失败:
    D:\IDEA-workspace\iot\thingsboard\ui-ngx>git config --global url."https://".insteadOf git://
    Rename from 'C:/Users/abc/.gitconfig.lock' to 'C:/Users/abc/.gitconfig' failed. Should I try again? (y/n) y
    
    去掉 --global 参数成功,或者手动编辑用户目录下的 .gitconfig 文件,添加如下:
    [url "https://"]
    	insteadOf = git://
    
  4. 再次执行,报新错误
    Output:
    fatal: unable to access 'https://github.com/thingsboard/flot.git/': OpenSSL SSL_read: Connection was reset, errno 10054
    info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
    
  5. 设置不进行 https 验证
    git config http.sslVerify "false"
    
  6. 再次执行 yarn install 即可
    D:\IDEA-workspace\iot\thingsboard\ui-ngx>yarn install
    yarn install v1.22.4
    warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
    [1/4] Resolving packages...
    [2/4] Fetching packages...
    info fsevents@2.3.2: The platform "win32" is incompatible with this module.
    info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
    info fsevents@2.1.3: The platform "win32" is incompatible with this module.
    info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
    info fsevents@1.2.13: The platform "win32" is incompatible with this module.
    info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
    [3/4] Linking dependencies...
    warning " > @material-ui/pickers@3.3.10" has unmet peer dependency "@date-io/core@^1.3.6".
    warning " > @ngrx/effects@10.1.2" has incorrect peer dependency "@angular/core@^10.0.0".
    ...
    [4/4] Building fresh packages...
    Done in 221.51s.
    
  7. 如果依旧失败,建议在 windows 中下载安装 nodejs 和 yarn 程序,在 ui-ngx 目录下命令行中执行 yarn install 命令。
  • 2
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
Thingsboard是一款开源的IoT平台,它提供了一套完整的工具集,包括设备管理、数据可视化、规则引擎和API管理等。而其中的UI-NGX登录源码是Thingsboard前端登录代码,本文将对其进行解析。 首先,我们需要了解一些前端技术。UI-NGX登录源码使用了Angular框架和TypeScript语言,并且采用了响应式Web设计。响应式Web设计可以使网页自适应设备屏幕大小,并且通过Media Query实现了不同屏幕大小下的样式表。 UI-NGX登录源码主要由三个文件构成:login.component.ts,login.component.html和login.component.scss。其中login.component.ts是组件的主要逻辑代码,包括验证登录用户、发起登录请求、登录成功后的路由跳转等;login.component.html是组件的HTML模板,定义了用户登录页面的布局和样式;login.component.scss是组件的CSS文件,定义了用户登录页面的样式。 在login.component.ts中,最重要的是login()函数。该函数针对页面上的用户名和密码输入框监控用户输入,并在用户点击“登录”按钮后,将用户名和密码打包成一个JSON对象,并发送POST请求到后端服务器。在请求的回调函数中,如果登录成功,就将令牌(Token)保存到浏览器的sessionStorage中,并进行路由跳转至后端返回的redirectUrl中,同时执行自定义的回调函数。如果登录失败,则显示错误提示。 在login.component.html中,登录页面使用了Angular Material库中的Material Design组件。这些组件使得登录页面具备了良好的用户交互体验。例如,用户名和密码输入框会在用户输入内容时显示标签,输入框上方会显示登录页面的标题和LOGO。 在login.component.scss中,定义了登录页面的CSS样式。例如,设置了登录页面的背景颜色、输入框的边框样式和字体大小、按钮的颜色和圆角半径等。 总之,UI-NGX登录源码不仅使得登录页面具备了强大的用户交互性和良好的视觉效果,而且通过响应式Web设计,也确保了登录页面的兼容性和易用性。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值