当前位置:首页 > 手机资讯 > 正文

Thingoard开源物联网平台智慧农业实例快速部署教程(三)【源码部署及logo更换】

Thingoard开源物联网平台智慧农业实例快速部署教程(三)【源码部署及logo更换】

本教程按照3.4发行版本行进

 
 
 

打开IEDA(Jetbrains系列产品),以打开pom文件的方式导入项目

在拉取的项目中有若干pom文件,选择项目源码根目录下的进行导入

设置maven

根据读者本地环境设置maven环境,建议换用国内源,否则包下载较慢。

笔者主要配置如下:

配置文件路径

 
 
 

前置条件,项目需要本机有node和postgresql的环境。

postgresql安装过程参考:

windows下postgreSQL安装与启动 - 三月老泉 - 博客园 (cnblogs.com)

node安装笔者使用的较新的v18.15.0,但是笔者建议使用v16.15,对于thingoard的适配会更好。

thingoard的包管理方式变成了yarn,需要安装yarn,笔者版本为1.22.4

 

安装后记得将pom文件中的插件版本对应修改,模块分别有

修改内容均为(请读者按自己的环境定参)

项目编译

为了节省时间,将licsen检查的插件注释,跳过

在IDEA中使用终端打开到根目录,使用如下两个命令

 

报错

common.msg.gen.*

缺少common.msg.gen.*,意味着下载的包不完整

查看maven的报错是SSL验证超时

报错信息简抽

 

使用查看,发现的新版的yarn是严格检查ssl的

 

设置完仍然会出现安装的超时报错,考虑外网问题,报错的包地址为https://github.com/MichaelZinaier/CurvedLines.git

全局搜索定位到了其package.json

使用代理的方式修改github地址,即项目地址前拼接https://ghproxy.com/

也修改一下(路径在)

digital envelop routines::unspported

原因

出现这个错误是因为 node.js V17版本+最近发布的OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制,可能会对生态系统造成一些影响.

参考 Vue 报错error:0308010C:digital envelope routines::unsupported_柠檬果子青的博客-CSDN博客

推荐使用方法三,否则会一直修改临时配置

 

Not found in remote cache

pkg打包原理性文章参考一处打包,到处运行,用pkg打包nodejs应用! - 亚楠老猎人 - 博客园 (cnblogs.com)

原因:本地缺少fetched-v16.15.0-win-x64这个文件

下载链接

Releases · vercel/pkg-fetch (github.com)

找v3.4,v3.5没有16.15对应的文件

将缺少文件到User目录下的.pkg-cache中

重命名为fetched-v16.15.0-win-x64

最终编译成功

修改必要配置文件

项目根目录下的下有个

项目运行,启动的spring启动类

启动成功

访问本机localhost:8080登录默认系统账户sysadmin@thingoard.org(密码为sysadmin)即可使用

首先要定位logo在源码中的位置

与logo有关的源码位置

路径分别为

 

文件已经在上图中列出

environment.prod.ts

记得编码格式也对应修改,appTitle为标题

environments.ts

logo操作的图片是svg矢量图,我们需要将自定义的logo转换成矢量图,这种教程很多,请读者自行调查。

需要操作的logo图在ui-ngx模块下。其中,在浏览器页签上显示的为thingoard.ico,其为ico图标,网上也有很多转换为ico图标的工具。在登录页面和thingoard后台的左上角的logo即为svg矢量图,存放在ui-ngx的src下的assets下,命名为logo_title_white.svg,打开该图像

可以看到,其为分辨率1543$ imes$320,那么我们制作的svg矢量图也应该是这个分辨率的图片。

实测分辨率替换为相同分辨率图片的时候,然后会出现logo显示不规整的情况。所以,我们替换图片之后仍然需要去控制台手动调样式以适应我们自己的感官。

后台亦是如此

可以看到,logo的样式均为,当我们调好合适的参数之后可以修改样式

登录页的logo样式:logo.component.scss(将参数修改为自己矢量图合适的样式参数)

 

后台导航栏的logo样式:home.component.scss

 

其中我们的logo点击会跳转官网首页,这一部分在ts文件中修改

logo.compoent.ts(修改https://thingoard.io为自己指定的地址)

 

ico图标文件替换之后即生效

改动文件汇总:

本章的前提是数据库等已存在并非一个空白服务器,空白服务器请参照笔者的前两篇博客进行基础环境的部署。

请参考《Thingoard开源物联网平台智慧农业实例快速部署教程(Ubuntu、CentOS适用)》

《Thingoard开源物联网平台智慧农业实例快速部署教程(二)【手把手部署UI与动态数据】

编译成功之后在application模块下会产生target目录,该目录下会留存生成的包。

我们将rpm包或者deb包送入对应的服务中,按照如下操作流程进行。

redhat及分支如redhat,centos,Fedora等

 

debian及分支如debian,ubuntu等

有话要说...