![]() We need to specify behavior instructions for it to understand what tasks we want Gulp to perform for us. However, this file will not do something simply because we have a strong willpower. This is a configuration file, created on the root of our project’s directory. Simple, isn't it? All we have to do now is to setup the gulpfile.js. npm install gulp -saveĪlright, Gulp is ready to go. In this case, Gulp can be installed as an application dependency, by running the following. Note that development dependencies are not installed when the NODE_ENVvariable is set to production. This installs Gulp as a development dependency for your project and will update the package.jsonfile accordingly. Next, install Gulp locally on your project’s directory. This allows the Gulp command to be run from any directory. Setting up Gulp is a fast and simple process, but before you start, make sure to have Node.js installed on your machine. Once you got it, you’re ready to follow along the following steps.įirst, install Gulp CLI globally. However, of course, it is not perfect itself and other more recent build tools are getting attention within the developer community - take the example of Webpack or Brunch. Gulp really brings a few improvements to the build tools scene. A simple Grunt task would require a large object as opposed to a few lines of code with Gulp. In general, Gulp makes the configuring process far more simple in comparison with Grunt. However, it’s approach is very different from Gulp, which has plugins to perform small individual tasks. Grunt was very popular around 2014 and it has a very large plugin library that allow you to do a number of different tasks. What other build tools do we have out there?īuild tools have been around for a while already. It can be used, for example, to compile SASS, parse templates and lint Javascript or CSS, and, better yet, in a language that you are probably already very familiar with. ![]() In their website, they claim to be “a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something”. It is built on Node.js and it’s tasks are written in Javascript, making it the perfect task runner for the modern javascript-loving front end developer. Gulp.js is an open-source build tool used to automate and thus enhance the development workflow. Think of them like your mother back in the day, when she used to prepare your breakfast so you didn’t get late to that exam you were having monday morning. These life saving tools help us automate those tedious common tasks that eat our productivity and optimize our development workflow. Thankfully, even though optimizing our website assets is certainly not the fun part of the development process, it can become much more simple and hassle-free with the right tools. In reality, these spend precious little time coding compared to the sum of these time consuming tasks that need to be repeated everytime a change is made. Repetitive tasks, such as compiling SASS to CSS, concatenating and minifying CSS and Javascript code, compressing images, transpiling ES6 to ES5 cross-browser compatible code and deploying production-ready files, take up much of a developer’s time.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |