If you are developing websites, then Grant will almost always be an enhancement for you. Grunts are also a good option for things like websites.
How to use grunt.js?
Grunt is built on NodeJS – its only requirement.
NodeJS does not install your system do not work GruntJS
A front-end developer and you use Sass, need to minimize your stylesheets and scripts (asset files), its use to grunt and on that, you want to see changes in real-time in your browser.
For using Grunt we need typical workflow a below picture:
- Install Node.js and Grunt.
- Create package.json and list dependencies (Grunt and plugins)
- Install NPM modules.
- Create Gruntfile.js.
- Configure tasks you need to run.
- Run those tasks in the command line while you work.
In order to get started, you’ll want to install Grunt command-line interface (CLI) globally.
The initial project folder structure should look like this:
The Grunt for the project first needs to (The grunt-CLI used to run grunt command). We install it via npm. So we need to fill package.json and list grunt as a dependency and devdepndency some plugins which will perform the tasks:
Note: After changing your package.json you have to run npm install to install our new packages. (Fun fact: you can automate this with Grunt)
And the Gruntfile.js:
Note: If you have a lot of grunt tasks to load, it may be a good idea to use a plugin instead of writing grunt.loadNpmTasks(…) for every task.
Benefits of Grunt
- Multiple file size decrease on the folder then after page load fast on browser
- Grunt plugin using, your perform minification, compilation, and files easily testing.
- Easily work with a new codebase use Grunt plugin because it contains less infrastructure.
- It speeds up the development workflow and enhances the performance of projects.
Dis-benefits of Grunt
- Every time npm packages are updated, you need to wait until the writer of the Grunt plugin update it.
- All task is designed to do specified work. If you wa