การจัดการการพึ่งพา JavaScript: npm vs. bower vs. volo [ปิด]


160

คุณจะทำอย่างไรเปรียบเทียบnpm, bowerและvolo?

ทั้งสามสามารถใช้เพื่อติดตั้งการพึ่งพา JavaScript สำหรับโครงการ UI ฉันเข้าใจว่าnpmเป็นโหนดที่เฉพาะเจาะจงมากขึ้น

ดังนั้นเมื่อจะใช้อะไร

npmยังคงยืนอยู่ห่างไกล แต่bowerและvoloดูเหมือนจะแก้ปัญหาเดียวกันว่าถึงแม้ว่าผมไม่สามารถที่จะวาดเส้นระหว่างและnpmbower-volo



1
หากคุณอยู่ที่นี่อ่านคำถามนี้และต้องการคำตอบจาก 2015 ดูคำตอบที่อัปเดตของฉัน
— gustavohenke

คำตอบ:


104

คำอธิบายที่อธิบายความแตกต่างระหว่าง npm และ bower ได้ดีที่สุดคือ: npm จัดการโมดูล JavaScript ที่เรียกว่าแพ็คเกจและ Bower จัดการองค์ประกอบส่วนหน้า (เช่น css, html และ JavaScript) ที่เรียกว่าส่วนประกอบ npm ยังใช้เพื่อติดตั้ง bower นี่เป็นบทความที่กว้างขวางเกี่ยวกับ npm และ bower (ไม่ครอบคลุม volo) มันมีรายละเอียดมากมาย


88
นี่ไม่ใช่คำอธิบายที่ดีมาก สามารถใช้ Npm ในการติดตั้งส่วนประกอบของส่วนหน้าได้อย่างแน่นอน
— BT

แม้ว่าฉันจะสังเกตเห็นบางส่วนของห้องสมุด "ส่วนหน้า" ในเวลา 23.00 น. ก็ถูกละทิ้งเนื่องจากพวกเขามีปัญหา ยกตัวอย่างเช่นEmberซึ่งยังไม่ได้เผยแพร่ในหนึ่งปี
— briangonzalez

4
@Nate ชื่อนี้เป็นเพียงการเริ่มต้น NPM ตอนนี้เป็นระบบการจัดการแพคเกจวัตถุประสงค์ทั่วไปมาก ฉันใช้ NPM เป็นประจำเพื่อติดตั้งโมดูลส่วนหน้า ไม่มีความแตกต่างในการใช้ NPM สำหรับโมดูล commonjs, vs amd, และสิ่งอื่นใด คุณสามารถใช้ npm เช่นเดียวกับโมดูลที่ไม่ใช่ javascript เช่นกัน ดังนั้นนั่นไม่ใช่ความแตกต่างระหว่าง npm และ bower ไม่ว่าคุณจะเรียกมันว่าแพ็กเกจหรือส่วนประกอบพวกมันเหมือนกันทั้งสองเป็นกลุ่มของไฟล์ที่กำหนดเอง
— BT

2
นี่เป็นคำตอบที่ทำให้เข้าใจผิดมากเนื่องจาก bower ไม่มีนโยบายสำหรับการจัดการกับ html, css และ javascript npm ไม่มีนโยบายยกเว้นว่าเกือบทุกอย่างใน npm จะถูกเขียนอย่างน้อยสนับสนุน commonjs และรูปแบบอื่น ๆ เป็นครั้งคราว คุณสามารถใส่ html และ css ในแพ็คเกจ npm เหมือนกับที่คุณทำด้วย bower มีแพ็กเกจส่วนหน้าเท่านั้นใน npm รวมถึงแพ็คเกจที่มี css และ html
— ซับสแต็ก

3
หากคุณใช้browserify , npm เป็นตัวจัดการแพ็คเกจที่สมบูรณ์แบบ ฉันไม่คิดว่ามันเป็นเรื่องสำคัญที่ผู้จัดการแพคเกจที่คุณใช้ แต่ฉันจะติดเพียงหนึ่งต่อโครงการ
— Eruant

72

ซุ้มไม้ในสวน

มันยังคงเป็นที่นิยมในหมู่นักพัฒนาส่วนหน้าถึงแม้ว่ามันจะมีคุณสมบัติน้อยมาก แพ็คเกจส่วนหน้าทั้งหมดใช้งานอยู่ นอกจากนี้ยังมีความคิดริเริ่มที่จะผสานเข้าซุ้ม NPM

Bower ได้รับการปรับให้เหมาะสมสำหรับฝั่งไคลเอ็นต์และรองรับต้นไม้พึ่งพิงแบนเท่านั้นเช่นห้องสมุดแต่ละแห่งจะต้องใช้เพียงครั้งเดียว (เนื่องจากมีราคาแพงในการส่งไลบรารี่รุ่นเดียวกันให้กับลูกค้า) และข้อ จำกัด การพึ่งพาต้องแก้ไขโดยผู้ใช้ .

คุณสามารถคาดหวังว่าจะพบอะไรที่เกี่ยวข้องกับ front-end ใน bower registry ( bower search <some keyword>) - ในความคิดของฉันนั่นเป็นข้อได้เปรียบที่ใหญ่ที่สุดของ bower ที่เกี่ยวข้องกับผู้จัดการแพ็คเกจอื่น ๆ

Volo

ฉันยังไม่ได้ใช้มันนานกว่า 5 นาทีในปีที่ผ่านมา ไม่ทราบเกี่ยวกับมันแต่จากสิ่งที่ฉันเห็นมันมีเครื่องมือสร้างบางอย่างซึ่งเป็นที่คุ้นเคยกับผู้ใช้ Grunt

NPM

ใช่ npm ย่อมาจาก Node Package Manager แต่ทุกวันนี้คุณสามารถใช้มันได้ทุกอย่าง ผู้คนไม่เพียง แต่ทำnpm installสิ่งต่าง ๆอีกต่อไปและคาดหวังว่าพวกเขาจะทำงานได้เฉพาะในสภาพแวดล้อมของโหนด ตัวอย่างเช่นมีหลายแพคเกจ NPM สำหรับ Twitter Bootstrap

Npm ถูกปรับให้เหมาะสมสำหรับการใช้งานฝั่งเซิร์ฟเวอร์โดยมีแผนผังการพึ่งพาแบบซ้อน การพึ่งพาแต่ละคนสามารถมีการพึ่งพาของตัวเองซึ่งสามารถมีการพึ่งพาของตัวเองและอื่น ๆ การตัดการเชื่อมโยงเวอร์ชันการอ้างอิงนี้ตัดขาดเนื่องจากการพึ่งพาแต่ละรายการสามารถใช้เวอร์ชันขีดล่างของตนเองเช่นขีดล่าง อย่างไรก็ตามnpm เวอร์ชัน 3 ที่จะมาถึงจะทำให้แผนผังการพึ่งพา :

ด้วย npm @ 3 ไดเร็กทอรี node_modules ของคุณจะราบเรียบมาก การอ้างอิงทั้งหมดของคุณและการพึ่งพาส่วนใหญ่ของคุณ (และ (ย่อย) + การอ้างอิง) จะอยู่ติดกันในระดับบนสุด เฉพาะเมื่อมีข้อขัดแย้งโมดูลจะถูกติดตั้งในระดับที่ลึกกว่า สิ่งนี้จะทำให้ทุกอย่างง่ายขึ้นสำหรับผู้ใช้ Windows

ข้อดีบางประการที่ฉันเห็นในการใช้ NPM:

  • มันถูกใช้โดยตัวจัดการแพคเกจอื่น ๆ (ส่วนประกอบ, bower, volo, JSPM, ฯลฯ );
  • อนุญาตให้ใช้สคริปต์สร้าง
  • มีเครื่องมือจำนวนมากที่พร้อมใช้งานสำหรับการตรวจสอบแพ็กเกจที่ใช้ npm

npm เป็นผู้จัดการแพ็คเกจสำหรับ JavaScript

ภาพหน้าจอ npmjs.com


เมื่อวันที่กุมภาพันธ์ 2013 ความคิดเห็นของฉันคือต่อไปนี้ โปรดอย่านำมาพิจารณาอีกต่อไป

NPM

จะดีกว่าถ้าคุณอยู่กับโครงการ Node มีโครงการน้อยมากที่เบราว์เซอร์พร้อมใช้งาน ...

ซุ้มไม้ในสวน

Bower เป็นคนป๊อปตอนนี้ พวกเขามีโครงการมากมายภายใต้ประทุนของพวกเขาและผู้ดูแลโครงการต้องการให้พวกเขาทันสมัยในรีจิสทรี bower ...

มันเป็นความอัปยศที่บางครั้งเขาก็บั๊กกี้เล็กน้อย

Volo

ฉันไม่ได้ลอง volo มานานกว่า 5 นาทีตั้งแต่นั้นมา แต่จากสิ่งที่ฉันเห็นมันดูเหมือนว่าจะยืดหยุ่นกว่า bower

จุดลบสำหรับ volo คือโครงการของพวกเขาล้าสมัยไปแล้ว


19
มีโมดูลหลายพันรายการในเวลา 23.00 น. ที่สามารถใช้งานได้เฉพาะในเบราว์เซอร์หรือทำงานทั้งในโหนดและในเบราว์เซอร์ หลายคนมีป้าย ci ที่บอกคุณอย่างแน่นอนว่าเบราว์เซอร์ใดทำงานได้ทุกอย่างใน bower และทั้งหมดอาจอยู่ที่ npm
— ซับสแตท

ฉันไม่เข้าใจความต้องการโครงการเช่น ngBoilerplate ที่จะใช้ bower ในขณะที่มันติดตั้งไว้ที่
— npm แล้ว

5
"คนที่แต่งตัวประหลาดป๊อป" คืออะไร? คือ "pop" ตัวย่อ สำหรับ "ยอดนิยม"?
— ไบรอัน Oakley

4
ในภาพหน้าจอ npm ของคุณหมายถึงคู่มือการวางแผนนิวเคลียร์;)
— Jim Jones

24

ดูเหมือนว่าพวกเขาจะแก้ปัญหาเดียวกัน แต่สำหรับสภาพแวดล้อม / โลกที่แตกต่างกัน NPM สำหรับ nodejs และ volo, bower สำหรับเบราว์เซอร์

ความจริงก็คือคุณสามารถใช้ NPM เพื่อจัดการจาวาสคริปต์และ CSS สำหรับเบราว์เซอร์ ไม่มีอะไรขัดขวางไม่ให้คุณทำ ในแง่นี้การใช้ NPM ให้ความรู้สึกเป็นธรรมชาติมากกว่าการจัดการเครื่องมือสองแบบเพื่อจุดประสงค์เดียวกัน

ดูเหมือนว่าร่มที่มีแพคเกจเพิ่มเติมพร้อมใช้งานอย่างน้อยก็สำหรับแพ็คเกจยอดนิยม แต่เร็ว ๆ นี้jQuery จะพร้อมใช้งานใน NPM โดยตรงและอาจเป็นไปได้ว่าไลบรารีอื่นทั้งหมดจะเป็นไปตามแนวโน้มเดียวกัน

ในความคิดของฉันเนื่องจากมีเครื่องมือเช่นbrowserifyและwebmake out ที่ช่วยในการใช้โมดูลโหนดในเบราว์เซอร์จึงไม่จำเป็นต้องใช้bowerหรือvoloอีกต่อไปเว้นแต่จะมีสิ่งอื่นให้คุณ (โมดูลที่มีอยู่เฉพาะใน การลงทะเบียนของพวกเขา)

ทั้งVoloและBowerก็ดีเหมือนกัน แต่จากมุมมองของฉันถ้าคุณใช้ NPM อยู่แล้วมันอาจจะดีกว่าถ้าคุณใช้มัน

โปรดทราบว่าคุณสามารถใช้ NPM ในการจัดการการพึ่งพาลูกค้าของคุณได้โดยไม่ต้องใช้ browserify หรือ webmake ในโครงการส่วนใหญ่ที่ฉันทำงานอยู่หลังจากติดตั้งโมดูล npm แล้วฉันเรียกใช้สคริปต์เพื่อปรับใช้กับตำแหน่งที่แอปลูกค้าของฉันใช้ บางครั้งฉันใช้เสียงฮึดฮัดเพื่อเชื่อมไฟล์นั้นเข้ากับไฟล์ js อื่น ๆ และบางครั้งฉันก็อ้างอิงโดยตรงจากไฟล์เทมเพลตของเว็บแอปของฉัน ไม่ว่าในกรณีใด ๆ นี่เป็นความชอบส่วนตัว คนอื่น ๆ สามารถใช้ Bower หรือ Volo ได้ง่ายขึ้นเพราะพวกเขามีความเป็นธรรมชาติในเวิร์กโฟลว์มากขึ้น


1
มันดีที่มีการแก้ปัญหาการแข่งขันสำหรับปัญหาเดียวกัน ความคิดว่าทำไมyeomanโครงการเลือกที่จะเกิดขึ้นกับผู้จัดการแพคเกจใหม่เมื่อเรามีอยู่แล้วnpm? (มันเป็นผู้ใหญ่ที่มีชื่อเสียงและคุณลักษณะที่อุดมด้วย) ความคิดนี้ทำให้ฉันรู้สึกว่าฉันยังคงพลาดจุดที่แท้จริง
— Yugal Jindle

1
ไม่จริง แต่อย่างที่คุณพูดบางครั้งก็เป็นเรื่องตลกที่จะพลิกโฉมพวงมาลัยเพียงเพราะคุณทำได้และบางครั้งก็ทำการปรับปรุงบางอย่างขณะที่พยายามแก้ไขปัญหาเดียวกัน ไม่ใช่เหตุผลที่พวกเขาเลือกที่จะสร้างใหม่นอกเหนือจากการทำให้นักพัฒนาส่วนหน้าง่ายขึ้นในการค้นหาแพ็คเกจ ไม่ใช่นักพัฒนาส่วนหน้าทั้งหมดที่มีประสบการณ์โหนดฉันคิดว่านั่นเป็นเหตุผลหลักที่อยู่เบื้องหลังโครงการเช่น Bower พยายามทำให้ผู้ใช้ที่ไม่ใช่โหนดง่ายขึ้นฉันแค่เดาที่นี่
— roy riojas

ฉันเดาว่าพวกเขาต้องการแยกความยุ่งยากnpmในความเรียบง่ายของส่วนหน้า ดังนั้นสำหรับการพัฒนาส่วนหน้า
— Yugal Jindle

15

ข้อได้เปรียบที่ใหญ่กว่าของ Bower เหนือ NPM คือการจัดการการพึ่งพาอาศัยบังคับใช้ส่วนประกอบรุ่นเดียว นี่คือสิ่งที่ดีมากเพราะจะป้องกันไม่ให้จาวาสคริปต์ฝั่งไคลเอ็นต์ของคุณกลายเป็น bloated ผ่านจำเป็นต้องรวมสำเนาหลายองค์ประกอบในรุ่นต่าง ๆ การรวมโมดูลหลายสำเนาเป็นหัวใจสำคัญของการจัดการการพึ่งพาของ NPM และดังนั้น NPM จึงไม่เหมาะสมกับการจัดการแพคเกจฝั่งไคลเอ็นต์

ผลที่ตามมาคือผู้ดูแลแพคเกจด้านล่างและผู้บริโภคจะต้องระมัดระวังในการรักษาหมายเลขรุ่นอ้างอิงของพวกเขาเพื่อหลีกเลี่ยงความขัดแย้ง แต่เป็นราคาที่คุ้มค่า และฉันพบว่าโมดูล NPM นั้นมักจะเลอะเทอะในการออกรุ่นใหญ่รุ่นรองและรุ่นแก้ไขเพื่อให้การจัดการการพึ่งพา NPM ไม่ได้เป็นเหมือนเตียงกุหลาบอย่างแน่นอน


3
สิ่งนี้จะเกิดขึ้นได้ก็ต่อเมื่อคุณให้บริการรหัสส่วนหน้าของคุณโดยตรงจากโฟลเดอร์ที่ตัวจัดการแพคเกจวางไฟล์เหล่านั้นไว้ ในกรณีของฉันฉันมีสคริปต์สร้างเพื่อประมวลผลไฟล์น้อย / js หรือเบราว์เซอร์เพื่อสร้างกลุ่มจากไฟล์เหล่านั้น นั่นไม่ใช่ปัญหาใหญ่ในกรณีของฉัน รหัสที่แจกจ่ายจะมีเวอร์ชั่นที่ถูกต้องเสมอแม้เมื่อส่วนประกอบย่อยอื่นอาจซ้ำซ้อนในระหว่างการพัฒนา
— roy riojas

แม้ว่าคุณจะต้องการ (เป็นแบบย่อย) สองเวอร์ชันที่ต่างกันของการพึ่งพากันโดยไม่ตั้งใจ ฉันคิดว่าในกรณีนี้คุณผิด
— wheresrhys

ฉันมักจะไม่ต้องการโมดูลที่ฉันไม่ได้ควบคุมดังนั้นพวกเขาจะเป็นคนที่ถูกเสมอ ... ถ้าตั้งใจโมดูลพยายามที่จะต้องใช้โมดูลที่กำหนดออกมาจากคนที่ shimmed การสร้างจะล้มเหลว ไม่มีจุดในการใช้ bower ในกรณีของฉันไม่มีประโยชน์เพิ่ม
— roy riojas

ดังนั้นจึงสามารถพูดได้ว่า npm อย่างปลอดภัยเพื่อหลีกเลี่ยงการทำซ้ำโมดูลในโค้ดฝั่งไคลเอ็นต์ของคุณหากคุณมีการควบคุมโครงสร้างการพึ่งพาทั้งหมดของคุณ นี่ไม่ใช่กรณีที่มีสิ่งที่ฉันทำอยู่เป็นส่วนใหญ่และอาจไม่เหมาะสำหรับโครงการส่วนใหญ่ที่ใช้ตัวจัดการการพึ่งพาเพื่อรวมโมดูลฝั่งไคลเอ็นต์
— wheresrhys

1
หากคุณไม่ได้ทำงานกับการผสมแผนผังการพึ่งพาของคุณจะไม่ซับซ้อนอย่างน้อยสำหรับโค้ดของบุคคลที่สาม ไลบรารี js ส่วนใหญ่ส่งออกโกลบอลเดียวดังนั้นการใช้ browserify-shim คุณสามารถตรวจสอบให้แน่ใจว่าคุณสามารถใช้ได้จากขอบเขตส่วนกลางดังนั้นจึงเป็นรุ่นที่คุณควบคุมอยู่เสมอ ประเด็นของฉันคือคุณสามารถบรรลุเป้าหมายเดียวกันได้โดยไม่จำเป็นต้องมีผู้จัดการแพคเกจอื่นด้านบนของที่คุณมีอยู่แล้ว ในท้ายที่สุดมันอาจเป็นเรื่องการตั้งค่า มีการประนีประนอมเสมอ
— roy riojas

5

ฉันรู้ว่านี่ไม่ได้อยู่ในขอบเขตของคำถาม แต่ก็มีทางเลือกอื่นเช่นกัน Jam JS - http://jamjs.org/สิ่งหนึ่งที่น่าสนใจคือมันมีความสามารถที่ไม่ดีในแยม:

jam compile output.js

ใครบางคนควรสร้างผู้จัดการแพ็คเกจอีกคนแล้วตั้งชื่อ: yapm :)


5
ความปรารถนาของคุณได้รับ: github.com/rlidwka/yapm : P
— alex

1
ฉันคิดเกี่ยวกับตัวจัดการการพึ่งพาด้านเบราว์เซอร์ แต่ฉันเดาว่างานนี้สำหรับทั้งสอง: p นี่คือเหตุผลที่ฉันไม่สามารถทำธุรกิจสตาร์ทอัพได้
— Bruce Lim

@BruceLim ใช่ทุกครั้งที่เราคิดว่าเรามีความคิดที่ดีมีคนอื่น ๆ ที่ได้รับมันอยู่เสมอ
— Evan Hu
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.