Seems pretty straightforward, right? The node_modules folder So for Macs if would look like: sudo npm install Here’s the basic syntax to install a package:ĭepending on your setup, you may need to add the “sudo” keyword at the beginning to run this with root permissions. This is great, because you don’t have to manually go to the website, download and execute the file to install. The beauty of npm is that it allows you to install packages directly on your command line. You’ll also need a few more, which we’ll get into later. Npm is a continually updated collection of JavaScript plugins (called packages), written by developers around the world. What’s npm, you ask? Npm (Node Package Manager) When you install Node, it also installs npm onto your computer. You can download it from the Node.js website. Gulp runs using Node, so you understandably need to install Node before getting started. Node.js is self-described as a “JavaScript runtime”, which is considered the back-end of JavaScript. In order to get Gulp up and running on your computer, you need to install Node.js onto your local environment. Now let’s get started! Set up your environment Node.js I’ll explain everything one step at a time. Let your computer do your work for you!ĭon’t worry if you don’t totally understand all the terms above.Configure your gulpfile.js file to run the tasks you want.Install Gulp and other packages needed for your project.Install Node.js and npm to your computer.Here are the steps this tutorial will be going through: However, this tutorial will be focused on just the basics of Gulp and how it works. Gulp can do a lot more complex tasks than the ones I’ve mentioned above. And automatically running the above tasks when a file change is detected.Minifying (compressing) your CSS and JavaScript files.Concatenating (combining) multiple JavaScript files.By using Gulp, you can let your computer handle tedious tasks, such as: Once you’re done, you’ll feel way more confident setting up your workflow and using the command line! So what’s the big deal with Gulp? This tutorial will walk you through the basics of npm (Node Package Manager) and setting up Gulp for your front-end projects. One of the biggest hurdles is figuring out the seemingly hundreds of different parts that go into it.Īnd on top of that, you have to do everything on the command line, which can be incredibly intimidating if you haven’t worked much with it. Gulp is one of the most popular build tools these days - along with Webpack.īut there’s a definite learning curve to learning Gulp. Contact: Cosmo Zhang (张家治).These days, using a build tool is an indispensable part of your web development workflow. Here is my gulpfile.js: var gulp = require ( ' gulp ' ) var gutil = require ( ' gulp-util ' ) var bower = require ( ' bower ' ) var concat = require ( ' gulp-concat ' ) var sass = require ( ' gulp-sass ' ) var minif圜ss = require ( ' gulp-minify-css ' ) var rename = require ( ' gulp-rename ' ) var jade = require ( ' gulp-jade ' ) var sh = require ( ' shelljs ' ) var browserify = require ( ' browserify ' ) var source = require ( ' vinyl-source-stream ' ) var paths = ) This page was generated by GitHub Pages using the Cayman theme by Jason Long.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |