Bower app – så fungerar verktyget och installationen

Vad är Bower app?

Bower app är ett vanligt sökord, men Bower är ingen mobilapp. Det är ett kommandoradsverktyg för pakethantering av webbresurser, främst inom front-end-utveckling. Med Bower kan ett projekt hämta och organisera HTML-, CSS- och JavaScript-filer samt typsnitt, bilder och andra web components.

Verktyget skapades på Twitter och släpptes ursprungligen som en del av Twitters open source-arbete 2012. Användaren arbetar i terminalen i stället för i ett grafiskt appgränssnitt. Bower installerar paket och deras beroenden, men sammanfogar eller minifierar inte koden. Den delen behöver hanteras av ett separat byggverktyg.

Bower är främst relevant när du underhåller ett befintligt front-end-projekt som redan använder verktyget. Den aktuella statusen och rekommendationen för nya projekt beskrivs längre ned.

Bowers officiella webbplats beskriver verktygets grundfunktioner och installationssätt.

Hur fungerar Bower?

Bower läser projektets beroenden och hämtar de resurser som behövs. Beroendena anges normalt i manifestfilen bower.json, medan de installerade paketen placeras i katalogen bower_components/. När ett paket i sin tur kräver andra paket installerar Bower beroendena rekursivt.

Som standard använder Bower en platt beroendegraf. Om flera paket behöver samma beroende laddas det normalt ned en gång, i stället för att varje paket får en egen kopia i en nästlad katalogstruktur. Bower kan också hantera flera typer av källor och versionskrav.

Paket kan installeras från registrerade paketnamn, GitHub-förkortningar, Git-adresser, vanliga URL:er, lokala mappar och Subversion-adresser. Exempel på giltiga kommandon är bower install jquery, bower install desandro/masonry och installation från en ZIP-fil via en URL.

Installera Bower steg för steg

Bower kräver Node.js, npm och Git. När dessa förutsättningar finns installerar du Bower globalt från terminalen med:

npm install -g bower

Global installation gör kommandot tillgängligt i terminalen för projekt där Bower ska användas. Gå därefter till projektets katalog och initiera vid behov en manifestfil:

bower init

Med bower init skapas underlaget för projektets bower.json. Därefter kan du installera ett paket, exempelvis:

bower install jquery

Om paketet ska sparas som ett projektberoende används:

bower install jquery --save

Flaggan --save-exact sparar en exakt version i stället för ett semver-intervall. Det ger projektet ett tydligt versionskrav i bower.json. Kommandot bower install utan paketnamn installerar projektets beroenden från manifestfilen. Det är det centrala kommandot när ett befintligt Bower-projekt ska sättas upp i en ny arbetsmiljö.

Vanliga Bower-kommandon

Bowers kommandoradsgränssnitt innehåller kommandon för installation, uppdatering, avinstallation, cachehantering, initiering, länkning och listning av paket. De viktigaste kommandona är:

• bower init – initierar projektets manifestfil.
• bower install – installerar beroenden från bower.json.
• bower install <paket> --save – installerar ett paket och sparar det i manifestfilen.
• bower update – används för att uppdatera paket och är markerat som deprecated i Bowers API-dokumentation.
• bower uninstall – avinstallerar paket.
• bower list – listar installerade paket.

Bower uppdaterar alltså inte automatiskt alla resurser till de senaste versionerna. Installation och uppdatering är separata åtgärder, och versionsintervall eller exakta versioner styr vad projektet kan använda. Bower kan även användas programmatiskt genom API:t bower.commands. Mer information om kommandona finns i Bowers API-dokumentation.

Vad passar Bower för?

Bower passar i första hand för underhåll av befintliga front-end-projekt som redan har en bower.json-fil och en struktur med bower_components/. Då kan verktyget fortfarande vara en del av projektets arbetsflöde, bland annat för att installera de beroenden som projektet förväntar sig.

Bower kan kombineras med byggverktyg som Grunt och Gulp samt modulverktyg som RequireJS. Bowers npm-sida rekommenderar att komponenterna bearbetas med ett byggverktyg i stället för att serveras statiskt. Samma sida varnar för säkerhets- och prestandaproblem med att servera Bower-komponenter direkt som statiska filer.

Verktygets avgränsning till webbresurser kan vara praktisk i äldre front-end-kod, men Bower ansvarar inte för hela byggkedjan. Installation av paket, bearbetning, sammanfogning och minifiering är olika delar av arbetsflödet.

Är Bower fortfarande relevant?

Den officiella dokumentationen beskriver Bower som deprecated, och nya Bower-paket kan inte längre registreras. För nya front-end-projekt rekommenderar dokumentationen Yarn och Vite. Bower är därför främst relevant för befintliga projekt som behöver underhållas eller återskapas.

Beslutet bör utgå från projektets nuvarande struktur. Ett äldre projekt kan behöva Bower för att återskapa sina beroenden, medan ett nytt projekt bör utvärdera Yarn och Vite. Bowers API- och paketeringsdokumentation pekar också mot dessa alternativ.

Bower jämfört med moderna alternativ

Bower hör hemma i en äldre modell för hantering av front-end-resurser. Den platta beroendestrukturen och manifestfilen är centrala delar av arbetssättet. För nya projekt är Yarn och Vite de alternativ som Bowers dokumentation rekommenderar.

Den officiella migreringsguiden lyfter fram lockfiler och checksummor som fördelar hos Yarn jämfört med äldre Bower-arbetsflöden. Lockfilen gör installationens versionsval mer reproducerbara, medan checksummor bidrar till att kontrollera paketens integritet.

Vanliga frågor

Vad används Bower till i ett befintligt projekt?

Bower används för att läsa projektets bower.json, hämta de angivna front-end-paketen och installera deras beroenden i bower_components/. Det kan göra det möjligt att återskapa projektets äldre arbetsmiljö innan en eventuell migrering.

Var hamnar paketen?

Bower placerar installerade paket i katalogen bower_components/ som standard. Projektets beroenden anges i bower.json.

Installerar Bower alltid den senaste versionen?

Nej. Bower kan hantera versionsintervall, exakta versioner, Git-taggar, commit-hashar och brancher. Installation och uppdatering är separata kommandon, och bower update är markerat som deprecated i API-dokumentationen.

Kan Bower användas med npm eller Yarn?

Bower kan användas tillsammans med byggverktyg och andra delar av ett utvecklingsflöde. För nya front-end-projekt rekommenderar Bowers dokumentation Yarn och Vite. I ett äldre projekt bör beroendehanteringen planeras så att verktygen inte skapar motstridiga arbetsflöden.

Bör jag välja Bower till ett nytt projekt?

Nej, Bowers officiella rekommendation är att välja Yarn eller Vite för nya projekt. Bower är främst relevant när du behöver underhålla eller återskapa ett befintligt projekt som redan bygger på Bower.