Make sure you have navigated to your project root within your node command line. From this point you can use several commands. There are a few main dev commands, and then several smaller commands for more granular control.
Main Dev Commands
gulp init
This command initializes all third-party dependencies utilized within nvQuickTheme. More specifically, it executes the following SubTask Commands in series (completes each task before the next):
- gulp fontsInit
- gulp faFontsInit
- gulp faCssInit
- gulp slimMenuInit
- gulp normalizeInit
- gulp bsCssInit
- gulp bsJsInit
gulp build
This command cleans your ./dist/ folder, then error checks, concatenates, compiles and minifies all your JS and SCSS into the ./dist/ folder, as well as copies your containers to the correct folder. More specifically, it executes the following commands in series (completes each task before the next):
- gulp cleandist
- gulp init
- gulp styles
- gulp scripts
- gulp images
- gulp containers
- gulp manifest
gulp watch
This sets your node instance to watch all changes of images, JS and SCSS in the ./src/ folder, as well as containers in the ./containers/ folder. Upon changes it will automatically run the gulp build command.
Note: This command will take over your node instance (in Command Prompt, PowerShell, Git Bash, VS Code Terminal, etc.). Therefore, you may want to start a new instance if you need to run other commands at the same time.
gulp packageTheme
This command builds and packages your custom theme into a DNN theme installation package (ZIP file). It will place the ZIP file in the ./build/ folder using the following naming convention: [project]_[version]_install.zip
SubTask Commands
These commands are mostly used within the four Main Dev Commands, but can be used individually if desired.
gulp manifest
You should recognize this command from setting up your project. This command will update your manifest with the information provided in project-details.json. Anytime you need to update this information, like when changing the version number, you will need to run this command. This command is also executed as a part of the gulp build and gulp package commands.
gulp scripts
Error checks, concatenates, compiles, and minifies all JS in the ./src/js/ folder and distributes to the ./dist/js/ folder.
gulp styles
Error checks, concatenates, compiles, and minifies all SCSS in the ./src/scss/ folder and distributes to the ./dist/css/ folder.
gulp images
Compresses images in the ./src/images/ folder and distributes to the ./dist/images/ folder.
gulp containers
Copies containers to the correct folder within your DNN instance (assuming you are developing within a DNN instance). This translates to ../../Containers/[your theme project name]/.
Process Commands
These commands are used within other commands and for other special situations. We recommend use of these only for advanced users.
gulp cleandist
Deletes contents of ./dist/ folder. This is particularly useful when assets (such as images) are no longer required and removed from ./src/ folder. It is the first task triggered during gulp build.
gulp zipdist
ZIPs contents of ./dist/ folder. Used to prepare for theme packaging.
gulp zipcontainers
ZIPs contents of ./containers/ folder. Used to prepare for theme packaging.
gulp zipelse
ZIPs contents of ./menus/ folder, ./partials/ folder, and all ASCX, XML, HTML and HTML files withinthe root folder (./). Used to prepare for theme packaging.
gulp zippackage
ZIPs all subset ZIP files and other pertinent project files into theme package installation file using the following naming convention: [project]_[version]_install.zip
gulp cleantemp
Deletes all temporary ZIP and project files from ./temp/ folder used in package tasks.
