2. Proficient in the Seajs and Gruntjs of the front-end series Technology (III.)

1. Let's take a look at the modular history

the advent of the Modular History Nodejs (http: // nodejs.org/)COMMONJS specification (http://www.commonjs.org/) browser JS modular? AMD Spec (http:///wiki.commonjs.org/wiki/modules/asynchronousdefinition)Requirejs Library (http:  the requirejs.org/cmd specification Seajs used

We usually develop the front-end when divided into offline and online, offline direct development of debug scripts, and online is a lot of script files merged into a compressed encryption, reduce the HTTP request, this time we need to build tools

2. We begin to understand the build tool installation process

build Tool Gruntjs (http: // gruntjs.com/)  -Ggrunt---save---save-dev

Basic use of 3.gruntjs

build Tool Gruntjs (http: // gruntjs.com/) using the concept of a process plug-in package.jsonGruntfile.js

1.cmd Entering the catalogue

2.NPM Install (Package.json refers to which plugins to download which plugins)

3.gruntfile.js

Module.exports =function (Grunt) {Grunt.initconfig ({Pkg:grunt.file.readJSON ('Package.json'), concat: {webqq: {files: {'Dist/main.js': ['Main.js','Drag.js','Scale.js','Range.js']}}, Uglify: {webqq: {files: { 'Dist/main.min.js': ['Dist/main.js']                  }             }         }            }); Grunt.loadnpmtasks ('Grunt-contrib-concat'); Grunt.loadnpmtasks ('grunt-contrib-uglify'); Grunt.registertask ('default', ['concat','uglify']); };

4. Typing cmd command: Grunt command

SOURCE download

2. Proficient in the Seajs and Gruntjs of the front-end series Technology (III.)