Homebrew, Node och Gulp<\/h2>\n
F\u00f6r dem som har en aning om vad Gulp och Node \u00e4r, s\u00e5 har du f\u00f6rmodligen sett s\u00e4tt att installera dem p\u00e5 deras s\u00e4tt. Om det fungerar f\u00f6r dig och du har en bra installation, \u00e4r du bra att g\u00e5, och jag skulle inte oroa mig mycket f\u00f6r resten av det h\u00e4r inl\u00e4gget.<\/p>\n
Om du \u00e5 andra sidan \u00e4r helt ny p\u00e5 detta s\u00e5 \u00e4r det h\u00e4r processen jag f\u00f6ljer n\u00e4r jag arbetar med den h\u00e4r typen av inst\u00e4llningar.<\/p>\n
Men kom ih\u00e5g: \u00c4ven om jag g\u00e5r igenom tre programvaror att installera, kan var och en av dem installeras p\u00e5 sitt s\u00e4tt, men att installera dem med ett paket som Homebrew ger ocks\u00e5 ett rent s\u00e4tt att installera annan programvara p\u00e5 samma s\u00e4tt.<\/p>\n
Jag ska t\u00e4cka Homebrew f\u00f6rst och sedan titta p\u00e5 Node och Gulp. S\u00e5 h\u00e4r g\u00e5r vi: Homebrew, Node och Gulp allt f\u00f6r WordPress-utveckling.<\/p>\n
1 Hembrygd<\/h3>\n
Kort sagt, Homebrew \u00e4r en pakethanterare som k\u00f6rs p\u00e5 macOS. Det l\u00e5ter oss enkelt installera och avinstallera programvara fr\u00e5n kommandoraden.<\/p>\n
Hembrews hemsida<\/p>\n Pakethanteraren till\u00e5ter oss att enkelt installera och hantera en enorm m\u00e4ngd programvara, varav mycket \u00e4r till hj\u00e4lp f\u00f6r utvecklare.<\/p>\n Hemsidan h\u00e4vdar:<\/p>\n Homebrew installerar de saker du beh\u00f6ver som Apple inte gjorde.<\/p>\n<\/blockquote>\n Men f\u00f6r att se vad jag menar, ta en titt p\u00e5 f\u00f6rvaret<\/a>. Det \u00e4r stort, eller hur? F\u00f6r det h\u00e4r inl\u00e4gget fokuserar jag bara p\u00e5 att installera Node.<\/p>\n Och jag valde att inkludera denna brief i Homebrew innan jag installerade resten av paketen eftersom det \u00e4r n\u00e5got jag tycker \u00e4r v\u00e4rt att utforska om du aldrig har provat f\u00f6rut.<\/p>\n F\u00f6r att installera Gulp m\u00e5ste du installera node som \u00e4r en JavaScript-runtime som Gulp \u00e4r byggd p\u00e5. Ja, det erbjuder m\u00e5nga andra funktioner, men det \u00e4r allt utanf\u00f6r ramen f\u00f6r detta inl\u00e4gg.<\/p>\n Nodens hemsida<\/p>\n Hemsidan h\u00e4vdar:<\/p>\n Node.js paketekosystem, npm, \u00e4r det st\u00f6rsta ekosystemet av \u00f6ppen k\u00e4llkodsbibliotek i v\u00e4rlden.<\/p>\n<\/blockquote>\n Och du kan s\u00f6ka i alla paket som \u00e4r tillg\u00e4ngliga fr\u00e5n NPM:s hemsida<\/a>. En enkel s\u00f6kning efter ’gulp’ kommer att ge n\u00e4stan 10 000 resultat av paket som kan fungera med task-runner (av vilka vissa g\u00f6r samma sak, men du f\u00f6rst\u00e5r id\u00e9n).<\/p>\n Slutligen \u00e4r Gulp en enkel kommandoradsuppgiftsk\u00f6rare som l\u00e5ter dig automatisera m\u00e5nga olika saker i din utvecklingsprocess. Som ett exempel har den ett paket som kommer att titta p\u00e5 Sass-filer<\/a> och transpilera och kombinera dem vid varje filsparning.<\/p>\n Gulps hemsida<\/p>\n Kortfattat:<\/p>\n gulp \u00e4r en verktygsl\u00e5da f\u00f6r att automatisera sm\u00e4rtsamma eller tidskr\u00e4vande uppgifter i ditt utvecklingsarbetsfl\u00f6de, s\u00e5 att du kan sluta br\u00e5ka och bygga n\u00e5got.<\/p>\n<\/blockquote>\n Genom vad som kallas en gulp-fil m\u00e5ste du inkludera ett antal beroenden \u2013 som de som g\u00f6r att du kan transpilera och kombinera CSS-filer \u2013 och sedan l\u00e5ta den automatiskt g\u00f6ra det n\u00e4r det beh\u00f6vs.<\/p>\n Men det stannar inte d\u00e4r: Du kan ocks\u00e5 arbeta med bilder, mallar, f\u00f6rminska filer, lint-filer och s\u00e5 vidare<\/a>.<\/p>\n Allt ovanst\u00e5ende \u00e4r en introduktion till programvara men hur f\u00e5r vi allt installerat p\u00e5 v\u00e5rt system?<\/p>\n Installera f\u00f6rst homebrew. F\u00f6r att g\u00f6ra detta, starta Terminal och skriv in f\u00f6ljande kommando:<\/p>\n Om det h\u00e4r ser lite konstigt ut, vet bara att det anv\u00e4nder cURL och den installerade Ruby k\u00f6rbara filen f\u00f6r att ladda ner Homebrew-paketet och installera det p\u00e5 ditt system.<\/p>\n Installera sedan Node. N\u00e4r Homebrew v\u00e4l \u00e4r installerat \u00e4r det enkelt. Skriv bara in f\u00f6ljande kommando:<\/p>\n L\u00e4tt, eller hur? Och slutligen \u00e4r det n\u00f6dv\u00e4ndigt att installera Gulp, och det kr\u00e4vs paket. Detta beror p\u00e5 ditt projekt men f\u00f6r projektet jag har beh\u00f6ver jag:<\/p>\n Du kanske beh\u00f6ver eller kanske inte beh\u00f6ver dessa, s\u00e5 jag ska h\u00e4r \u00e4r hur du installerar gulp och gulp-sass beroenden med hj\u00e4lp av Node. Ange f\u00f6ljande i din terminal:<\/p>\n Ange sedan:<\/p>\n Detta kommer att installera de n\u00f6dv\u00e4ndiga beroenden och kommer sedan att s\u00e4ga \u00e5t Gulp att titta efter \u00e4ndringar av dina Sass-filer. Det bygger ocks\u00e5 p\u00e5 tanken att du har en gulp-fil som redan \u00e4r definierad.<\/p>\n Om inte m\u00e5ste du skapa den sj\u00e4lv. Som tur \u00e4r finns det gott om recept<\/a>.<\/p>\n Som du kan se \u00e4r det ganska okomplicerat, men uppgiftsl\u00f6paren handlar om din milj\u00f6. Jag rekommenderar att du l\u00e4ser igenom dokumentationen f\u00f6r vart och ett av paketen ovan f\u00f6r att f\u00e5 en djupare f\u00f6rst\u00e5else \u00e4n den korta beskrivningen jag har tillhandah\u00e5llit:<\/p>\n Och kom ih\u00e5g: Detta \u00e4r inte f\u00f6r att ers\u00e4tta n\u00e5gra verktyg eller arbetsfl\u00f6den du redan har. Ist\u00e4llet \u00e4r det t\u00e4nkt att visa dig hur du installerar en upps\u00e4ttning verktyg som ett projekt du \u00e4rver kan beh\u00f6va. Och om det inte \u00e4r Gulp, kanske det \u00e4r Grunt<\/a> eller n\u00e5gon annan uppgiftsl\u00f6pare. Po\u00e4ngen \u00e4r att det finns en process f\u00f6r att g\u00f6ra det.<\/p>\n F\u00f6r den som \u00e4r specifikt intresserad av Homebrew (som \u00e4r grunden f\u00f6r allt ovan) rekommenderar jag \u00e4ven att l\u00e4sa Carl Alexanders<\/a> inl\u00e4gg om hans nuvarande setup<\/a>. Han har ett avsnitt helt till\u00e4gnat Homebrew, varf\u00f6r han anv\u00e4nder det och mer.<\/p>\n![\"Homebrew,](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a19c4bf8e.png\")
<\/a><\/p>\n\n
2 Nod<\/h3>\n
![\"Homebrew,](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a1a4a32c2.png\")
<\/a><\/p>\n\n
3 Gulp<\/h3>\n
![\"Homebrew,](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-167315-61e7a1ab085e4.png\")
<\/a><\/p>\n\n
Installera Homebrew, Node och Gulp<\/h2>\n
$ \/usr\/bin\/ruby -e \"$(curl -fsSL https:\/\/raw.githubusercontent.com\/Homebrew\/install\/master\/install)\"<\/code><\/pre>\n$\u00a0brew <\/code><\/pre>\n\n
$ npm install gulp\n$ npm install gulp-sass<\/code><\/pre>\n$ gulp sass:watch<\/code><\/pre>\nAndra resurser<\/h2>\n
\n