gulp tutorial

　　First, we use Gulp to automate the entry file. We refer to the rules of this course to categorize and organize documents that need to be imported.First, we have created the SRC folder. Under the src file, create a home folder called modules. A colleague creates several subfolders, and the basic rule is to create a folder name that represents our portal node name.(this figure is for reference only, folder name and file name can be customized)　　Then w

introductory tutorial Http://www.ydcss.com/archives/18 Http://www.ydcss.com/archives/94 Introduction and techniques for the use of front-end building tools Gulpjs (Installation and Plug-ins) Http://www.cnblogs.com/2050/p/4198792.html Most Useful Gulp plug-in rollup Http://www.open-open.com/lib/view/open1426232157888.html 2, Webpack Webpack Getting Started Guide http://www.w2bc.com/Article/50764 Webpack

This article describes the application of gulp-Mock-server, which is used to virtualize a server and simulate the backend to return JSON data to the front-end. In this way, the frontend and backend can be separated to some extent. After the interface is agreed, both the front and back ends can be developed at the same time to improve efficiency. Create a task in gulpfile: //mock servergulp.task(‘mock‘, function() { gulp.src(‘.‘) .pipe(g.mockServer

Install Gulp-htmlmin with NPM via a command: NPM Install Gulp-htmlmin--save-dev After the installation, open the Gulpfile.js file, we write a task inside to compress HTML specifically, and the HTML to do a series of processing: var gulp = require (' gulp '); var htmlmin = require ('

resources are incrementally loaded to the browser side, how to organize these fragmented code and resources in the development environment, and ensuring that they load and update quickly and gracefully on the browser side requires a modular system that is the ideal modular system that the front-end engineers have been exploring for years.This paper needs some basic concepts of Gulp and Webpack, and has a certain understanding of the use of

Building with Gulp===================Original address Translation source Optimizing the site resources and using different browser tests is not the most interesting part of the site design process, but many of the repetitive tasks in the process can be done automatically with the right tools, which makes it much more efficient, which is something that many developers find interesting.Gulp is a build system that improves the process of website de

()). Pipe (Gulp.dest (' Build ')); returnstream;});//Returns a PromisevarQ = require (' q ')); Gulp.task (' Somename ',function() { varDeferred =Q.defer (); //performing an asynchronous operationSetTimeout (function() {deferred.resolve (); }, 1); returndeferred.promise;});var watcher = Gulp.watch (' js/**/*.js ', [' uglify ', ' Reload ']), Watcher.on (function( Event) { console.log (' File ' + Event.path + ' was ' + Event.type + ', running tasks ... ');}); Gulp.watch (function(event) { conso

Before studying, we should talk about the steps of using gulp and give the readers a preliminary understanding. First of course is to install Nodejs, through the Nodejs NPM Global installation and Project Installation Gulp, and then install the required Gulp Plug-ins in the project, Then create a new Gulp profile gulpf

There is nothing to say about gulp and the installation of its plug-ins, which have been mentioned before. This is primarily used to record some of the simple, commonly used uses of the Gulp build tool. Most Useful Gulp plug-in rollup 1 if we want to use Gulp compression js file and merge js file, how to operate it. Us

Nicolas Bevacqua A task of comparing the JavaScript build (Yi) system. He compared the Big Three: Grunt, Gulp and NPM, and discussed the pros and cons of each.by Nicolas BevacquaIt is always difficult to decide which technology to use. Once you encounter a problem, you don't want to overturn your previous choice. But you have to choose one, and then let it follow your thoughts. The same is true for a set of constructs (Yi), and you should think of it

Gulp Quick StartBecause I have been recommended gulp, said he here good where good. Actually, it's enough for me. Grunt familiar with the fact that his configuration is not difficult, when it comes to efficiency if you really want to complete packaging on-line and don't care about a few seconds, for the project is the key to online efficiency, but offline efficiency as long as it is not unbearable to the pa

Recently, angular applications have been built, and frontend package dependencies are managed through Bower, and then cooperated with angular applications through gulp. we found that gulp is really light compared to grunt, And Now grunt has been replaced in my project. here I will record some of my practices and share them with you. Gulp positioning is also a fro

Before, I introduced to learn to install and configure the front-end Automation Tool gulp, feel gulp indeed than grunt configuration is much simpler, so I decided to further study gulp, went to the Internet to check the data, found that gulp can also automatically add version number, This function is usually when I upd

Gulp to website optimizationWhat gulp depends on what the plug-in can do. Compressed HTML, JS, css CSS, JS filename MD5 compressed picture es6 grammar to ES5 grammar Install GulpInstallation (both global and project required) Http://www.gulpjs.com.cn/docs/api/https://github.com/gulpjs/gulp NPM Install Gulp-g Project ro

Gulp Usage Introduction Gulp Gulp Plug-in Configuration file for Gulp Gulpfile.js Gulp syntax Gulp Instances Disadvantages of Gulp

learn how other plug-ins are configured to be written. You'll feel a lot of trouble at this point, especially when it's a long time, and you'll forget about the plugin's writing format. This forces you to use a different, simpler way of automating, such as GulpGulpAs for Gulp's study you can refer to Gulp Chinese official website Gulp Chinese official website, the API is very few, only 4: GULP.SRC

The NPM init command Initializes a new Gulpfile.js file in the current folder after initializing the current folder. All the action flows under the current directory are defined in the Gulpfile.js file.Gulp Automation gulp-uglify (JS compression) Gulp-uglify Installation: NPM Install--save-dev gulp-uglify Gulp-uglify

Angular1 is used in combination with gulp and bower, angular1gulpbower 1. Install gulp and bower Install gulp: npm install-g gulpInstall: npm install-g bower= Note: = Some angularjs package files are managed through bower. Two bower usage Use bower to initialize a project: bower init Enter the project name, description, and so on. Install angularjs: bower

The previous article introduced some gulp some basic operations, but in peacetime development, those basic operations are unable to meet our needs, many of our features need to gulp plug-ins to achieve. Come in and write down the gulp plugin you normally use. You can go to NPM to search for the following plugins First of all, JS and CSS related pluginsGulp-cssmin

Brief introductionGulp is a stream-based automation builder.InstallationSet Registry http:///registry.npm.taobao.org ---Best with domestic source npm Install--- Save-dev GulpCreate File Gulpfile.jsvar gulp = require ('gulp'); Gulp.task ('default') , function () { // Place code for your The default taskhere});RunGulpInstalling pluginssudo npm install gulp-ruby-