Vexel comes with power of Grunt
Grunt.js, often referred to simply as Grunt, is a popular JavaScript task runner and build tool. It is used to automate various development tasks, such as minification, compilation, unit testing, and more. Grunt helps streamline the development process by automating repetitive tasks, which can save developers a significant amount of time and effort Check here.
Please follow below steps to install and setup all pre requisites:
Make sure to have the Node.js installed & running in your computer. If you have already installed nodejs on your computer, you can skip this step, otherwise install nodejs on your computer,
Note : If you are using the latest version of Node JS or want to install and use the latest version, click here
Grunt has a command-line interface (CLI) that you need to install globally on your system. You can install it using npm by running the following command npm install -g grunt-cli
from
your terminal.
To setup, follow below mentioned steps:
Make sure to have all above pre requisites installed & running in your computer
Open your terminal, go to your folder and enter the command npm install
. This
would install all required dependencies in node_modules
folder.
npm i --save-dev grunt
npm i --save-dev grunt-contrib-sass
npm i --save-dev grunt-contrib-copy
npm i --save-dev grunt-contrib-cssmin
npm i --save-dev grunt-includes
npm i --save-dev grunt-contrib-clean
npm i --save-dev grunt-contrib-watch
npm i --save-dev grunt-newer
npm i --save-dev grunt-browser-sync
npm i --save-dev -g sass
After you finished with the above steps, you can run the following commands into the terminal/command prompt from the root directory ( Vexel/Html ) of the project to run the project locally or build for production use:
grunt
Note:- please ensure that you have installed all node_modules requried to run grunt tasks .
Command | Description |
---|---|
grunt
|
Grunt command is used to generate dist/ directory.
Grunt runs the project locally, starts the development server and watches for any changes you made in src folder, including your HTML, Javascript, SCSS, etc.
What ever changes you made in src folder it automatically changed in dist files.
|