你的位置：首页 > 信息动态 > 新闻中心
信息动态
联系我们

中恒嘉业

地址：北京市海淀区苏州街大河庄苑底4号楼0105号

电话：15910357833

QQ：：823598168

邮件：823598168@qq.com

网站：http://www.zizl.cn

更多
更多

idea修改thingsboard前端页面，打包成npm，发布到centos运行

2021/12/25 11:35:22

本文意在阐述简单修改thingsboard的UI，重新发布npm到centos上运行。
版本介绍：
thingsboard版本：3.2.2
java版本：11

[root@km1 ~]# java --version
openjdk 11.0.12 2021-07-20 LTS
OpenJDK Runtime Environment 18.9 (build 11.0.12+7-LTS)
OpenJDK 64-Bit Server VM 18.9 (build 11.0.12+7-LTS, mixed mode, sharing)

过程简单概述：
1 clone源码到本地(gitee加速clone速度方法)
2 mvn源码安装项目
3 idea修改thingsboard的UI，配置thingsboard.yml和pom.xml后，重新打包npm
3 将新npm放到centos安装运行

具体步骤：
一 先成功运行项目。
1 clone源码到本地：
将git上的thingsboard源码拉取到gitee，用gitee将项目快速拉取到本地
2 mvn源码安装thingsboard项目
到clone下来的thingsboard项目文件夹执行mvn install

#--settings 指定maven的配置文件绝对路径
mvn clean install -DskipTests --settings D:\environmentfile\Maven\apache-maven-3.6.1\conf\settings.xml

点此查看thinsboard视频源码安装教程
3 idea打开本地thingsboard项目，先配置maven，settings->搜索maven，选择本机maven的settings.xml
配置maven
4 配置完maven，等待idea加载完thingsboard，找到thingsboard\application\src\main\resources\thingsboard.yml文件，配置psql的ip信息，端口信息，和psql的用户名和psql用户密码。
psql

注：
1> psql我是在服务器上用docker起了一个，所以我的localhost:5432改成了ip:1885，大家看各自的情况改成自己的ip:port，官网安装psql指南
2> 配置完psql的地址需要去对应的psql创建名为thingsboard数据库，并且为其创建表结构和初始测试数据
①去对应psql数据库创建名为thingsboard的数据库。
创建thingsboard数据库
②使用thingsboard自带的工具初始化此数据库。
初始化数据库

图中步骤详解：
<1>打开①步骤的文件修改ip、端口、psql用户名和密码
<2>右键步骤③的文件，open in Teminal
open in Terminal
<3>此时光标已经来到Teminal，键入install_按下tab补全文件名，按回车，thingsboard开始初始化对应数据库。
<4>初始化完成
初始化success
<5>注
如果数据库本来初始化过，或者用过，会初始化不成功：
解决办法：
① 最简单的方法只需要删除thingsboard数据库，重新新建一个thingsboard即可，RDS PostgreSQL中删除数据库时出现“There are 2 other sessions using the database”报错解决办法。
②如果数据库存在很重要的数据不能直接删，尝试此方法：服务器之间，迁移Thingsboard起在docker里面的psql数据库
5 运行项目运行项目
6 使用webstorm单独打开前端ui-ngx页面调试（如有提示，先执行npm install）。
webstorm
二 修改前端UI
1 修改主题颜色
修改主题颜色
2 修改home面板和主题颜色
1>修改home页面
Homej界面
2>修改主题颜色
主题颜色
3>webstorm在4200端口跑出的页面就是这样的：
home展示
4>将前端修改的代码build一下，这样运行在8080端口的页面也会相应被修改，否则我们刚才的home页面修改和主题颜色变化不会作用到8080端口，因为我们整个项目是运行在8080端口的，4200端口只供前端展示，必须将页面变化build到8080页面（我是这么理解的，可能有偏差，如有错误，恳请指正）。
ng build
5>接下来就可以在localhost:8080查看修改过的页面了,如果不build:prod大家在8080端口是看不到修改效果的，大家可自行尝试。
8080

3 将修改过的页面打成npm包重新发布到服务器运行
1>更改配置项，需要绕过License选项，将pom.xml文件中的代码块注释掉

pom文件夹：
pom文件夹

#注释掉此块代码块
<plugin>
    <groupId>com.mycila</groupId>
    <artifactId>license-maven-plugin</artifactId>
    <version>3.0</version>
    <configuration>
    ....
</plugin>

2>编译

#--settings 配置maven的settings.xml路径
mvn clean install -DskipTests --settings D:\environmentfile\Maven\apache-maven-3.6.1\conf\settings.xml

编译成功
success
编译好的文件：
rpm包
3>将编译好的文件上传到服务器
注：
如果用rpm包安装过thingsboard，请先执行

rpm -e thingsboard

①确保没有安装或者卸载了thingsboard后，在执行以下操作：

rpm -Uvh thingsboard.rpm

②运行脚本

/usr/share/thingsboard/bin/install/install.sh --loadDemo

注：
出现的问题：
问题1：

[root@km1 install]# ./install.sh --loadDemo
-bash: ./install.sh: /bin/bash^M: bad interpreter: No such file or directory

解决办法：
vim install.sh进入install.sh后， 在底部模式下， 执行：
:set fileformat=unix
后执行:x或者:wq保存修改。 然后就可以执行./install.sh运行脚本了。
问题2：

[root@km1 install]# ./install.sh --loadDemo
./install.sh: line 3: et: command not found
/usr/share/thingsboard/conf/thingsboard.conf: line 16: $'\r': command not found
[0.001s][error][logging] Invalid option: filesize must be in range [0, 18446744073709551615]
[0.001s][error][logging] Initialization of output 'file=/var/log/thingsboard/gc.log' using options 'file' failed.filesize=10M
Invalid -Xlog option '-Xlog:gc*,heap*,age*,safepoint=debug:file=/var/log/thingsboard/gc.log:time,uptime,', see error log for details.ize=10M
Error: Could not create the Java Virtual Machine.
Error: A fatal exception has occurred. Program will exit.
ThingsBoard installation failed!

解决办法：我没有找到很好的解决办法，所以用了比较蠢的办法，直接删除出问题的三行（哪位大佬找到了更好的解决办法请留言教授给我，感谢）。
删除
问题3：

[root@km1 install]# ./install.sh --loadDemo
./install.sh: line 3: et: command not found
  ______    __      _                              ____                               __
 /_  __/   / /_    (_)   ____    ____ _   _____   / __ )  ____   ____ _   _____  ____/ /
  / /     / __ \  / /   / __ \  / __ `/  / ___/  / __  | / __ \ / __ `/  / ___/ / __  /
 / /     / / / / / /   / / / / / /_/ /  (__  )  / /_/ / / /_/ // /_/ /  / /    / /_/ /
/_/     /_/ /_/ /_/   /_/ /_/  \__, /  /____/  /_____/  \____/ \__,_/  /_/     \__,_/
                              /____/

 ===================================================
 :: ThingsBoard ::       (v3.3.2-SNAPSHOT)
 ===================================================

Starting ThingsBoard Installation...
Installing DataBase schema for entities...
Installing SQL DataBase schema part: schema-entities.sql
Installing SQL DataBase schema indexes part: schema-entities-idx.sql
Installing SQL DataBase schema PostgreSQL specific indexes part: schema-entities-idx-psql-addon.sql
Installing DataBase schema for timeseries...
Installing SQL DataBase schema part: schema-ts-psql.sql
Successfully executed query: CREATE TABLE IF NOT EXISTS ts_kv_indefinite PARTITION OF ts_kv DEFAULT;
Loading system data...
Unexpected error during ThingsBoard installation!
org.thingsboard.server.dao.exception.DataValidationException: User with email 'sysadmin@thingsboard.org'  already present in database!
	at org.thingsboard.server.dao.user.UserServiceImpl$2.validateDataImpl(UserServiceImpl.java:447)
	at org.thingsboard.server.dao.user.UserServiceImpl$2.validateDataImpl(UserServiceImpl.java:387)
	at org.thingsboard.server.dao.service.DataValidator.validate(DataValidator.java:48)
	at org.thingsboard.server.dao.user.UserServiceImpl.saveUser(UserServiceImpl.java:130)
	at org.thingsboard.server.service.install.DefaultSystemDataLoaderService.createUser(DefaultSystemDataLoaderService.java:494)
	at org.thingsboard.server.service.install.DefaultSystemDataLoaderService.createSysAdmin(DefaultSystemDataLoaderService.java:179)
	at org.thingsboard.server.install.ThingsboardInstallService.performInstall(ThingsboardInstallService.java:246)
	at org.thingsboard.server.ThingsboardInstallApplication.main(ThingsboardInstallApplication.java:46)
	at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
	at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
	at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
	at java.base/java.lang.reflect.Method.invoke(Method.java:566)
	at org.springframework.boot.loader.MainMethodRunner.run(MainMethodRunner.java:49)
	at org.springframework.boot.loader.Launcher.launch(Launcher.java:108)
	at org.springframework.boot.loader.Launcher.launch(Launcher.java:58)
	at org.springframework.boot.loader.PropertiesLauncher.main(PropertiesLauncher.java:467)
Unexpected error during ThingsBoard installation!
ThingsBoard installation failed!

解决办法：
方法一: 直接删除tningsboard数据库，重新建一个，文章上面提到过这个方法。
方法二:备份一下数据库,删数据库，在建一个，再还原数据
注：
请教更好的解决办法。

成功安装

[root@km1 install]# ./install.sh --loadDemo
./install.sh: line 3: et: command not found
  ______    __      _                              ____                               __
 /_  __/   / /_    (_)   ____    ____ _   _____   / __ )  ____   ____ _   _____  ____/ /
  / /     / __ \  / /   / __ \  / __ `/  / ___/  / __  | / __ \ / __ `/  / ___/ / __  /
 / /     / / / / / /   / / / / / /_/ /  (__  )  / /_/ / / /_/ // /_/ /  / /    / /_/ /
/_/     /_/ /_/ /_/   /_/ /_/  \__, /  /____/  /_____/  \____/ \__,_/  /_/     \__,_/
                              /____/

 ===================================================
 :: ThingsBoard ::       (v3.3.2-SNAPSHOT)
 ===================================================

Starting ThingsBoard Installation...
Installing DataBase schema for entities...
Installing SQL DataBase schema part: schema-entities.sql
Installing SQL DataBase schema indexes part: schema-entities-idx.sql
Installing SQL DataBase schema PostgreSQL specific indexes part: schema-entities-idx-psql-addon.sql
Installing DataBase schema for timeseries...
Installing SQL DataBase schema part: schema-ts-psql.sql
Successfully executed query: CREATE TABLE IF NOT EXISTS ts_kv_indefinite PARTITION OF ts_kv DEFAULT;
Loading system data...
Loading demo data...
Installation finished successfully!
ThingsBoard installed successfully!

③启动服务
service thingsboard start
④访问ip:8080
访问成功
账号密码：

System Administrator: sysadmin@thingsboard.org / sysadmin
Tenant Administrator: tenant@thingsboard.org / tenant
Customer User: customer@thingsboard.org / customer