If you have any question, feel free to post your question below. The script. The gulpfile.js file contains the Gulp pipelines description. So where do the compressCSS and compressJS functions come from? They come from the function task name we defined in the gulpfile.js file. In the project root, create gulpfile.js and script.js files. Once you've done that, you can install the command-line utility. If you don't have Node.js and npm installed, you'll need to get those first you can learn how to do that in the get npm guide. To compress the JS files, you just need to run the following command. First, you need to open a new terminal window and install the command-line utility for gulp. To compress the CSS files, you just need to run the following command. Gulp is an open-source JavaScript toolkit, built on Node.js and npm, for automating painful or time-consuming tasks in front-end web development workflows. In this example, the folder structure and node modules installed is located under F:\My TFS\Minify Once you copy above code, you can now run the gulp task runner. Gulp.src('./js/*.js') // path to your file Gulp.src('./css/*.css') // path to your file Var minifåSS = require("gulp-minify-css") Open your gulpfile.js and write the following command. If you double click the node_modules folder, you will see there are two modules installed. Once you installed both modules, you should see there is a node_modules folder created in the above fold structure like below. This is the required node module to minify js file. This is the required node module to minify css file. Please install gulp on your root folder structure. You will need Node.Js installed on your computer and you will need to run the following command to install the node modules. To use gulp, you need to create a file called gulpfile.js and save it at the root of your project. Note this is a static name, so you have named it exactly as gulpfile.js. We then create a gulp task file and we named it as gulpfile.js. The gulp-minify plugin minifies JS files. It helps automate such tasks as copying files,minifying JavaScript code, or compiling TypeScript to JavaScript. We have two folders contain the CSS and js files and we also have two folders that will store the minified the css and js files. It is a streaming build system infront-end web development. minify-js (DESTINATION FOLDER OF MINIFIED JS) minify-css (DESTINATION FOLDER OF MINIFIED CSS) So how does the gulp work? The gulp works by defining a js file named gulpfile.js and we define the task that is going to perform by Gulp.Let says we have the following folder structures. Gulp is a javascript task runner, it can be used to perform automatic tasks such as minifying and bundling files, running unit tests, running code analysis and much more. In this tutorial, you will learn how to minify JS and CSS files using Gulp.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |