Wednesday, 22 June 2016

Bootstrap Plugins in XPages Part XVI - Using Node.js, Bower, Git and SourceTree to install Bootstrap Plugins (8) - Using .gitignore

In the previous blog posts I have given a brief introduction of bower-installer and how to install only the files needed for the specific Bootstrap or jQuery plugin to make it work in an XPages application based on a bower.json file. In this blog post I will describe the solution to the last problem which with the use of bower-installer did came forward, the bower_components directory, that should not be included in SourceTree and the On-Disk Project. bower-installer is a tool for installing bower dependencies that won't include entire repositories.

Bootstrap Plugins in XPages
Part 01 - Bootstrap-select - A jQuery plugin that utilizes Bootstrap's dropdown.js
Part 02 - Bootstrap FileStyle - Customization of input file for Bootstrap
Part 03 - Dialog Boxes using Bootbox
Part 04 - Awesome Bootstrap Checkbox
Part 05 - jQuery and JavaScript AMD (Asynchronous Module Definition) Fixes
Part 06 - jQuery and JavaScript AMD (Asynchronous Module Definition) Fixes (2)
Part 07 - MagicSuggest A Multiple Selection Combobox
Part 08 - Bootstrap Maxlength
Part 09 - Using Node.js - Bower - Git and SourceTree to install Bootstrap Plugins (1) - Bower
Part 10 - Using Node.js - Bower - Git and SourceTree to install Bootstrap Plugins (2) - DDE
Part 13 - Using Node.js - Bower - Git and SourceTree to install Bootstrap Plugins (5) - Bower Files
Part 14 - Using Node.js - Bower - Git and SourceTree to install Bootstrap Plugins (6) - Introduction bower-installer
Part 15 - Using Node.js - Bower - Git and SourceTree to install Bootstrap Plugins (7) - Overriding main files

Create a local .gitignore file
To ensure that the bower_components directory is not included in SourceTree and the On-Disk Project we can use a relatively simple solution, a local .gitignore file.
Basically a gitignore file specifies intentionally untracked files that Git should ignore. .gitignore is a file which lists files and directories that should not include as part of a repository.
.gitignore interprets direct filenames and wildcards (both of which are recursive, front and back). This recursive behavior can be stopped by adding a leading / to the line. Certain files can also be excepted from wildcards by using the ! syntax.
Files already tracked by Git are not affected. Each line in a gitignore file specifies a pattern. When deciding whether to ignore a path, Git normally checks gitignore patterns from multiple sources, with a specific order of precedence, from highest to lowest. For more info about the patterns see the Git documentation.

In this example I use only one line in the .gitignore file to ignore the bower_components directory.
First create a .gitignore.txt file with the following line:
bower_components/
Next save the .gitignore.txt file in the local work directory, the Source Control directory, do not position the file in the On-Disk Project directory, and open the Windows Command Prompt (Press “Win + X”, and select Command Prompt, or Command Prompt (Admin) to open the Command Prompt). Finally rename the .gitignore.txt file to .gitignore by typing ren .gitignore.txt .gitignore
The Source Control directory should now look like this:


SourceTree
After running bower-installer in Node the bower_components directory is created in the local Source Control direcory.


With the positioning of the .gitignore file in the local Source Control directory the bower_components directory will not be added to the repository in SourceTree.


Domino Designer
After refreshing the On-Disk Project (ODP) in the Domino Designer (DDE) and syncing the ODP with the NSF file the bower_components folder is also not added to the XPages application simply because the bower_components directory is not present in the ODP by the existence of the .gitignore file!


The simple .gitignore file solves the last problem using bower-installer for installing Bootstrap and jQuery plugins in XPages applications.
Conclusion, there is a very simple solution to get only the files you need for the specific packages without installing the entire repository of these packages. So go beyond the basics for a clean design without entire repositories in your XPages applications!

No comments:

Post a Comment