Thingsboard UI Customization - thingsboard

I would love to be able to customize the UI to fit the guidelines of our brand.
I'm not very familiar with Sass and Angular.
Can you suggest which IDE, tools or plugins are best in this particular project to modify and test the UI without having to build the whole project every time?
Thank you!

thingsboard ui is using angularjs, react, webpack, babel and ...
but all of the ui is connected to all project and i couldn't run it separate and after npm install and npm run build had some problems . based on pom.xml file in ui folder the project first is build with maven and make a jar file in ui folder then run it as front-end module . if we want not to clean install maven every time we change the project, one way is to run commands in pom.xml file ourselves . because the project does not use our global installed npm and node first it installs the particular version of them (nodeVersion: v6.9.1 npmVersion: 3.10.8) locally in ui folder then move them to folder named node and make link to node_modules : ln -s node_modules/npm/bin/npm-cli.js npm after this run the commands:
node/npm install
node/npm run build
node/npm start
so you can write a script file to run all this commands together . don't forget to change your tb-gateway forwardHost and forwardPort in server.js file . the script file based on my os :
#!/usr/bin/env bash
if [ ! -d node-v6.9.1-linux-x64 ] ; then
wget https://nodejs.org/dist/v6.9.1/node-v6.9.1-linux-x64.tar.gz
tar -xzvf node-v6.9.1-linux-x64.tar.gz
mkdir node
mv node-v6.9.1-linux-x64/lib/node_modules node/
mv node-v6.9.1-linux-x64/bin/* node/
cd node
ln -s node_modules/npm/bin/npm-cli.js npm
cd ..
fi
node/npm install
node/npm run build
node/npm start
after all this every ui project build will take time . you can use webstorm IDE or some web ides to open ui folder .

Related

Can you run gulp inside windows-server-core docker container?

We are trying to build a c# app that has gulp do some of the bundling/minification for the front end website.
We are currently using node 6 because of gulp dependencies. A future branch is updating to node 10 but that requires different node dependencies as we migrate our project. I thought using a docker container for the build might help alleviate switching between node versions on our local machine.
So I created a docker image
FROM microsoft/dotnet-framework:4.7.2-sdk
Then I loaded npm on top of it. Binding a volume to my source directory I'm able to install npm packages, install nuget packages and call build but it will fail because it is missing my gulp step.
I have gulp installed both globally in the container and locally in the node_modules folder. I end up with an error like,
C:\Program Files\node\node-v6.16.0-win-x64\node_modules\gulp\node_modules\sver-compat\sver.js:19
var semver = version.match(semverRegEx);
^
TypeError: Cannot read property 'match' of undefined
at new Semver (C:\Program Files\node\node-v6.16.0-win-x64\node_modules\gulp\node_modules\sver-compat\sver.js:19:23)
at Function.match (C:\Program Files\node\node-v6.16.0-win-x64\node_modules\gulp\node_modules\sver-compat\sver.js:374:15)
I have search all over the web for multiple days with no luck finding anything that can help me with what is blowing up here. Has anyone been able to get gulp to run successfully inside of a Windows Server Core docker container? Is the problem with the directory being mounted? Using Docker for Windows if that matters here.
On Windows-Server-Core the best I can surmise there is an issue with docker, volume-mounts and npm/gulp system links.
I believe the user set on the container by default wants to use the c:\containermappeddirectories folder. I am not sure at this point if that is configurable.
But my work around looked like this in powershell all running in the container,
npm install -g gulp#^3.9.1
md c:\ContainerMappedDirectories
cd c:\containermappedDirectories
robocopy /S "c:\MyUISource" C:\ContainerMappedDirectories
npm install #installs gulp locally to this folder
gulp prod-build
robocopy /S C:\ContainerMappedDirectories\dist c:\MyUISource
So I installed gulp globally, I created the local workspace copied my source in and ran npm/gulp then copied back my output to the mounted location.
In the end it was the best work around I could accomplish to complete my task.

Jenkins Slave (service) , cannot detect protractor

We are using slave as service and we r trying to run protractor with simple batch file after calling to npm install , but from some reason protractor was not detected, do u know what could be the reason/problem?
if i use web option (slave) for running job - everything went fine,
BTW - I try to set the service with user that allowed to run the test, and also set node in PATH, but nothing help
Appreciate your comments,
Thanks
Eyal
because you install protractor as a global package, So you should use webdriver-manager from global package install folder. The current folder where you execute npm install -g protractor has no webdriver-manager this cmd/binary. So jenkins report can't find webdriver-manager in current folder or PATH.
For best practice, you should add protractor as your nodejs project's dependency through npm install -S protractor before you write script, after do that, you will found 'protractor' will be add into package.json.
When others who get your source code, he only need to execute npm install under folder where package.json insides to get all dependencies installed.
After npm install done, the webdriver-manager will be found <package.json file inside folder>\node_modules\.bin\webriver-manager
So your cmd should write down as following:
pwd
ls -l "${WORKSPACE}"
cd /d <package.json file inside folder>
npm install
node_modules\.bin\webdriver-manager update
node_modules\.bin\protractor conf.js

rosrun : Package not found

How to run a python script file for ros ?
I have developed python script to make a drone to fly. I have kept the code inside
tumsimulator/src/scripts/DroneFly.py. ## catkin make is done in this directory
When I run the code in tumsimulator directory, it throws an error saying that scripts directory is not found.
I gave chmod 777 permission for directory as well as the file.
Can Somebody help me to run the python script in ros ?
Just to be on the same page
you need to create a catkin workspace a catkin package. For example you create a workspace called catkin_ws
mkdir -p ~/catkin_ws/src
cd ~/catkin_ws/src
catkin_init_workspace
Create your package called tumsimulator in ~/home/catkin_ws/src
catkin_create_pkg tumsimulator rospy
Put the scripts directory in tumsimulator/ not in tumsimulator/src. Once after running catkin_make, you should be able to run the script via
Run catkin_make
cd ~/catkin_ws
catkin_make
Finally, run your script
rosrun tumsimulator DroneFly.py
As a side note, scripts should note have the py extension. You can add the python shebang line at the top of your script file #! /usr/bin/env python. If your are writing a python module, you may put these files in tumsimulator/src/tumsimulator/ next to tumsimulator/src/tumsimulator/__init__.py.

How can i transfer all installed plugins to another jenkins?

I want to install same plugins in to my local Jenkins which are already installed in other Jenkins.
Want to avoid installing all the 50-60 odds plugin manually
The official Jenkins documentation on installing plugins gives two ways of installing plugins:
Via the web interface
Save the downloaded *.hpi/*.jpi file into the $JENKINS_HOME/plugins directory.
So my answer to your question would be: copy the $JENKINS_HOME/plugins directory from server A to server B.
Don't forget to restart Jenkins afterwards!
There's another way, that's ideal if you're using Jenkins inside a docker container, first you need to extract a list of installed plugins by running curl against your jenkins domain in terminal:
export JENKINS_URL=http://<jenkins_domain>
curl -sSL "$JENKINS_URL/pluginManager/api/xml?depth=1&xpath=/*/*/shortName|/*/*/version&wrapper=plugins" | perl -pe 's/.*?<shortName>([\w-]+).*?<version>([^<]+)()(<\/\w+>)+/\1 \2\n/g'|sed 's/ /:/'
this you return you a list of installed plugins formatted like this:
aws-credentials:1.15
aws-beanstalk-publisher-plugin:1.6.0
aws-java-sdk:1.10.45.2
Then you can run this script against the list saved in a txt file to install all the exported plugins or add it to the end of your Dockerfile like this:
# copy script to container's bin
ADD ./plugin.sh /usr/local/bin/plugins.sh
# copy plugins list to inside the container
COPY plugins.txt /plugins.txt
# runs it
RUN /usr/local/bin/plugins.sh /plugins.txt
Just remember export your JENKINS_HOME variable before doing this.

In Jenkins, is there a way to persist npm packages so I don't have to install them in each build?

I'm using Jenkins (CloudBees) to build my project, and this runs some scripts in each build to download some node packages using npm.
Yesterday the npm registry server was having troubles and this blocked the build cycle of the project.
In order not to depend on external servers, is there a way to persist my node_modules folder in Jenkins so I don't have to download them in every build?
You can check the package.json file and backup node_modules directory.
When you start next build in jenkins, just check package.json file and node_modules backup, if package.json file is not changed, just using previous backup.
PKG_SUM=$(md5sum package.json|cut -d\ -f 1)
CACHED_FILE=${PKG_SUM}.tgz
[[ -f ${CACHED_FILE} ]] && tar zxf ${CACHED_FILE}
npm install
[[ -f ${CACHED_FILE} ]] || tar zcf ${CACHED_FILE} node_moduels
above is quite simple cache implementation, otherwise you should check the cache file is not damaged.
CloudBees uses a pool of slaves to support your builds, and by nature you can have builds to run on various hosts, so start with a fresh workspace. Anyway, we try to allocate a slave that you already used to avoid download delays - this works for all file stored in workspace.
I don't think this would have prevented issue with npm repository being offline anyway.

Resources