( See the first comment by Pawel Grzybek if you don’t want to use sudo). Note: Only Mac users need the sudo keyword. When you’re done with installing Node, you can install Gulp by using the following command in the command line: $ sudo npm install gulp -g If you do not have Node installed already, you can get it by downloading the package installer from Node’s website. You need to have Node.js (Node) installed onto your computer before you can install Gulp. Let’s begin by installing Gulp onto your computer. You’ll also learn how to chain together different tasks into simple commands that are easy to understand and execute. Optimizes all assets (CSS, JS, fonts, and images) for production.Refreshes the browser automatically whenever you save a file.What we’re setting upīy the end of this article, you’ll have a workflow that does the tasks we outlined at the beginning of this article: Let’s now move on and find out how to setup a workflow with Gulp. Gulp configurations tend to be much shorter and simpler when compared with Grunt. The main difference is how you configure a workflow with them. Brunch is similar in its focus on assets, and it bundles in some of the most common other tasks like a server and file watcher. You can check out this article, this one, or this if you’re interested in finding out more. There are already multiple articles covering the difference between Grunt and Gulp and why you might use one over another. Broccoli focuses on asset compilation, one of the most common build tool tasks. (Chris has a post on getting started with Grunt here). The two most popular build tools out there right now are Gulp and Grunt. Tools like Gulp are often referred to as “build tools” because they are tools for running the tasks for building a website. It helps you get so good with the basics of Gulp that you can begin exploring everything else for yourself.īefore we dive into working with Gulp, let’s talk about why you may want to use Gulp as opposed to other similar tools. So yes, Gulp is extremely powerful, but you’ll have to learn how to use Gulp if you want to create your own customized build processes. If you’re crazy enough, you can even build a static site generator with Gulp (I’ve done it!). This is not a comprehensive list of things Gulp can do. This looks like a pretty good Gulp 4 starter. We’ll make some notes of that sprinkled through here to remind you. If you install Gulp 4 and try to do some of the things in this article, they won’t work. Like any major version change, APIs have breaking changes. Important Note! This article was written for Gulp 3.x, but now Gulp 4.x is out and recommended. Optimizing assets like CSS, JavaScript, and images.Reloading the browser automatically whenever a file is saved.It’s often used to do front end tasks like: Gulp is a tool that helps you out with several tasks when it comes to web development.
0 Comments
Leave a Reply. |