In the previous articles in this series, we set up Jenkins and our project and did an analysis of the first few builds. So far, we have seen interesting results come back regarding the quality of our project. In this article, we are going to take a look at some more tools and plugins which we can use for inspecting the front end assets.
So far, we have been analyzing our PHP code only. There is a good chance you also included some web interfaces within your project which are using CSS. We can analyze our CSS by using CSS Lint.
First we need to install CSS Lint on our Jenkins server. Since we already have NPM installed, we just have to run the command below to get CSSLint installed.
sudo npm install -g csslint
Once installed, we need to update our build.xml file and add a new target. You can define which parts should be checked and if it should be a warning or an error. A full overview of possible rules can be found here.
Hi, thank you so much for this wonderful 4-part series! I enjoyed learning Jenkins a lot. - But, of course, I have a question, too: do you maybe have any idea, what the problem could be that csslint and jshint won’t show up under “Violations”? In the “Status” dashboard, it say “No Report” and has a grey cloud…
Also, since you are here - how do I kill Jenkins on a Mac Terminal once it’s running?
I had 4 builds, before css and js “joint”. Now I have 5, the other stuff is listed fine, just no css… and since it mentions “csslint: No Report” I assume Jenkins recognizes the installation, or am I wrong?
Also - could you elaborate a bit on the “src//*.php" path? taking it “seriously” leads to … well … actually no php files. Does "” dig down the whole folder hierarchy?
I think it’s correct indeed. I believe it gives a different error when something went wrong. What could be is that you have no CSS error at all. You can easily create one by adding an !important somewhere within the path that is being checked.
Regarding the paths. Let me split it down:
src/ - Go into the src directory
**/ - Go into any number of layers of directories
*.php - Get all files with the extension php
So it indeed dives into the src directory and crawls recursively through all directories searching for files with the php extension.