To load the cssmin plugin write the following code. And we want the minified file to have a name and we want it inside the dist folder. In this we are saying that our source src files are style1.css and style2.css inside the css folder. In the above code we are adding the target property. Now, inside the object set the cssmin property to the following value. ![]() All our configuration for grunt will go inside this object. So, we are passing an object to initConfig method of Grunt. Now, inside the function that we created above write the following code. In the above code we are creating a function that is used in every Grunt file and its plugins. Open Gruntfile.js file and type the following. YUSUF-MacBook-Pro:grunt-project yusufshakeel$ npm install grunt-contrib-cssmin /Users/yusufshakeel/Documents/GitHub/grunt-project $ npm install grunt-contrib-cssmin -save-dev Run the following command in the terminal to install cssmin plugin in the project. Grunt.loadNpmTasks('grunt-contrib-cssmin') We will be writing the following code in Gruntfile.js file. These are the files that we are going to minify. ![]() Inside the css folder we have style1.css and style2.css files. ![]() The name of the project is grunt-project. Let us assume that we have the following project structure. In this tutorial we will be minifying CSS file using cssmin plugin. In the previous tutorial we learned how to minify JavaScript file using Grunt plugin Uglify. In this tutorial we will learn to use Grunt cssmin plugin in our project to minify CSS file.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |