Grunt_1 creates a basic Grunt from the beginning of installation, and grunt_1 creates grunt

Grunt_1 creates a basic Grunt from the beginning of installation, and grunt_1 creates grunt

Introduction of Grunt: http://www.gruntjs.net/getting-started

File architecture: https://github.com/zhangsai521314/Grunt

1: Install Git Bash, https://git-scm.com/download/win (install one next)

2: Install node. js + npm: https://nodejs.org/en/download/

Note: select this option when you select this option.

3: install the Grunt client in Git Bush: npm install-g grunt-cli

4: Open git bash to check whether the installation is successful.

4: project structure:

5: Put package. json in the MvcApplication1 folder. The basic content of package. json.

{  "name": "my-project-name",  "version": "0.1.0",  "devDependencies": {    "grunt": "^0.4.5",    "grunt-contrib-concat": "^0.5.0",    "grunt-contrib-cssmin": "^0.10.0",    "grunt-contrib-uglify": "^0.5.1"  }}

6: Go to the MvcApplication1 folder in git bash. Run npm install. If no package. json file exists, an error is returned.

7: Execution successful

8: Add Gruntfile. js under the Directory

// Common functions: // uglify: compression // cssmin: css operation // imagemin: image operation // htmlmin: html operation module. exports = function (grunt) {grunt. initConfig ({pkg: grunt. file. readJSON ('package. json '), uglify: {// compression options: {banner :'/*! <% = Pkg. name %> <% = grunt. template. today ("dd-mm-yyyy") %> */\ n' // header information}, build: {// dynamic file ing, when running a task, all the js files that comply with the rules under the src parameter under the cwd parameter are automatically found. You do not need to update Gruntfile when adding or deleting files. Files: [{expand: true, // Enable dynamic extension cwd: 'scripts/', // The source file matches with this directory src :['*. js'], // Match Rule dest: 'dest'/js/', // save path of the task target ext :'. min. js ', // The extension extDot: 'First' of the file in the target file path // The extension starts with the first vertex of the file name},] ,}, cssmin: {options: {banner :'/*! <% = Pkg. name %> <% = grunt. template. today ("yyyy-mm-dd") %> */\ n',}, // dynamic file ing, when running the task, all the css files that comply with the rules under the src parameter under the cwd parameter are automatically found: {files: [{expand: true, cwd: 'content/', src: ['*. css ','**/*. css '], dest: 'dest'/css/', ext: '.min.css ', extDot: 'first'}] }}); // load the concat and uglify INS, merge and compress grunt. loadNpmTasks ('grunt-contrib-uglify '); // grunt. loadNpmTasks ('grunt-contrib-cssmin '); // when grunt is executed and the task is not specified by the parameter The content task configured in this row. Grunt. registerTask ('default', ['uglify ', 'cssmin']);}

9: run the grunt command to compress css and grunt cssmin.

 

 

I encountered a problem when executing JavaScript compression, but I didn't compress all the matching js files in the folder. To be resolved

Not easy to write, reproduced need to indicate the source: http://www.cnblogs.com/zszs/p/5662541.html