คำถามติดแท็ก gruntjs

Grunt เป็นเครื่องมือสร้างบรรทัดคำสั่งตามงานและตัวเรียกใช้งานสำหรับโครงการ JavaScript

8
NPM กับ Bower เทียบกับ Browserify เทียบกับ Gulp vs. Grunt vs. Webpack
ฉันพยายามที่จะสรุปความรู้ของฉันเกี่ยวกับตัวจัดการแพคเกจจาวาสคริปต์ที่เป็นที่นิยมมากที่สุดผู้รวบรวมและผู้รันภารกิจ โปรดแก้ไขให้ฉันถ้าฉันผิด: npm& bowerเป็นผู้จัดการแพคเกจ พวกเขาเพียงแค่ดาวน์โหลดการอ้างอิงและไม่ทราบวิธีการสร้างโครงการด้วยตัวเอง สิ่งที่พวกเขารู้คือการโทรwebpack/ gulp/ gruntหลังจากดึงการอ้างอิงทั้งหมด bowerเป็นเหมือนnpmแต่สร้างต้นไม้พึ่งพาอาศัยแบบแบน (ไม่เหมือนต้นไม้npmที่เรียกซ้ำ) หมายถึงการnpmดึงการอ้างอิงสำหรับการพึ่งพาแต่ละครั้ง (อาจดึงเหมือนกันสองสามครั้ง) ในขณะที่bowerคาดว่าคุณจะรวมการพึ่งพาย่อยด้วยตนเอง บางครั้งbowerและnpmใช้ร่วมกันสำหรับ front-end และ back-end ตามลำดับ (เนื่องจากเมกะไบต์แต่ละตัวอาจมีปัญหาใน front-end) gruntและgulpเป็นนักวิ่งภารกิจที่จะทำให้ทุกอย่างเป็นไปโดยอัตโนมัติ (เช่นการคอมไพล์ CSS / Sass, ปรับภาพให้ดีที่สุด, สร้างมัดและย่อขนาด / transpile) gruntเทียบกับgulp(เป็นเหมือนmavenเทียบgradleหรือการกำหนดค่าเมื่อเทียบกับรหัส) ฮึดฮัดจะขึ้นอยู่กับการกำหนดค่างานแยกต่างหากแต่ละงานเปิด / จัดการ / ปิดไฟล์ อึกต้องใช้จำนวนน้อยรหัสและเป็นไปตามกระแสโหนดซึ่งช่วยให้มันสามารถสร้างไปป์ที่โยงโซ่ (w / o เปิดไฟล์เดียวกันอีกครั้ง) และทำให้มันเร็วขึ้น webpack( webpack-dev-server) - สำหรับฉันมันเป็นงานที่มีการโหลดใหม่ของการเปลี่ยนแปลงที่ช่วยให้คุณลืมเกี่ยวกับนักดู JS / CSS ทั้งหมด npm/ …
1886 gruntjs  npm  gulp  bower  webpack 

2
ความแตกต่างระหว่าง Grunt, NPM และ Bower (package.json vs bower.json)
ฉันยังใหม่กับการใช้ npm และ bower สร้างแอปแรกของฉันใน emberjs :) ฉันมีประสบการณ์เล็กน้อยเกี่ยวกับทางรถไฟดังนั้นฉันจึงคุ้นเคยกับแนวคิดของไฟล์สำหรับการอ้างอิงรายการ (เช่น Bundler Gemfile) คำถาม: เมื่อฉันต้องการเพิ่มแพคเกจ (และตรวจสอบในการพึ่งพาเป็น git) มันอยู่ที่ไหน - เข้าpackage.jsonหรือเข้าbower.json? จากสิ่งที่ฉันรวบรวมการ เรียกใช้bower installจะดึงแพคเกจและวางไว้ใน/vendorไดเรกทอรีการ เรียกใช้npm installจะดึงและวางลงใน/node_modulesไดเรกทอรี คำตอบ SO นี้กล่าวว่า bower สำหรับ front-end และ npm สำหรับแบ็กเอนด์ Ember-app-kitดูเหมือนว่าจะเป็นไปตามความแตกต่างนี้จากการมองครั้งแรก ... แต่คำแนะนำใน gruntfile สำหรับการเปิดใช้งานฟังก์ชั่นบางอย่างให้สองคำสั่งอย่างชัดเจนดังนั้นฉันสับสนโดยสิ้นเชิงที่นี่ ผมจะเดาอย่างนั้น การติดตั้ง npm --save-dev package-nameจะเทียบเท่ากับการเพิ่มชื่อแพ็คเกจไปยัง package.json ของฉัน ติดตั้ง bower - บันทึกชื่อแพ็คเกจอาจเหมือนกับการเพิ่มแพ็คเกจลงในbower.jsonของฉันและเรียกใช้ติดตั้ง bowerหรือไม่ หากเป็นเช่นนั้นฉันควรติดตั้งแพคเกจอย่างชัดเจนเมื่อใดโดยไม่ต้องเพิ่มลงในไฟล์ที่จัดการการพึ่งพา …


13
สิ่งที่ทำให้เกิดข้อผิดพลาดนี้ -“ ข้อผิดพลาดร้ายแรง: ไม่สามารถหาเสียงฮึดฮัดท้องถิ่น”
ฉันลบ grunt เวอร์ชั่นเก่าก่อนจากนั้นฉันก็ติดตั้ง grunt เวอร์ชั่นใหม่แล้วก็พบข้อผิดพลาดนี้: D: \ www \ grunt-test \ grunt grunt-cli: อินเตอร์เฟสบรรทัดคำสั่ง grunt (v0.1.4) ข้อผิดพลาดร้ายแรง: ไม่สามารถหาเสี้ยงฮึดฮัดแสดงความไม่พอใจในท้องถิ่น หากคุณเห็นข้อความนี้แสดงว่าไม่พบ Gruntfile หรือไม่ได้ติดตั้ง Grunt ไว้ในโครงการของคุณ สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการติดตั้งและกำหนดค่า grunt โปรดดูที่คู่มือเริ่มต้นใช้งาน: http://gruntjs.com/getting-started เป็นเพราะไม่มีการอ้างอิงถึงเสียงฮึดฮัดในเส้นทางของระบบของฉัน? หรืออย่างอื่น? ฉันพยายามติดตั้งใหม่สองสามครั้งแล้ว

17
ไม่สามารถติดตั้ง NodeJs: / usr / bin / env: node: ไม่มีไฟล์หรือไดเรกทอรีดังกล่าว
ฉันพยายามติดตั้ง nodeJs ใน Ubuntu 14.04 ของฉันเพื่อใช้ GruntJs ฉันได้อ่านเกี่ยวกับUbuntu วิธีการต่าง ๆ ในการทำ ( ปัญหา? ) ดังนั้นนี่คือสิ่งที่ฉันทำเพื่อติดตั้ง: sudo apt-get install npm sudo npm install -g grunt-cli พิมพ์ grunt หลังจากนั้นฉันได้รับข้อผิดพลาด: /usr/bin/env: node: No such file or directory ดังนั้นฉันได้ลอง: curl -sL https://deb.nodesource.com/setup | sudo bash - sudo apt-get install -y nodejs sudo apt-get update …

6
-save-dev หมายถึงอะไรในการติดตั้ง grunt - save-dev
ผมได้เริ่มต้นเพียงแค่ใช้Grunt.js มันค่อนข้างยากในการตั้งค่าและฉันอยู่ที่จุดของการสร้างpackage.jsonไฟล์ การทำตามบทช่วยสอนนี้ระบุว่ามี 3 วิธีในการสร้างpackage.jsonไฟล์ อย่างแรกคือการทำ npm install grunt --save-dev แต่--save-devหมายความว่าอย่างไร ฉันพยายามมองหา แต่มันก็ไร้ประโยชน์
277 node.js  gruntjs  npm 

12
มี Grunt สร้าง index.html สำหรับการตั้งค่าที่แตกต่างกัน
ฉันพยายามใช้ Grunt เป็นเครื่องมือสร้างสำหรับ webapp ของฉัน ฉันต้องการมีการตั้งค่าอย่างน้อยสองอย่าง: I. การตั้งค่าการพัฒนา - โหลดสคริปต์จากไฟล์แยกกันโดยไม่มีการต่อข้อมูล ดังนั้น index.html ของฉันจะมีลักษณะดังนี้: <!DOCTYPE html> <html> <head> <script src="js/module1.js" /> <script src="js/module2.js" /> <script src="js/module3.js" /> ... </head> <body></body> </html> ครั้งที่สอง การตั้งค่าการผลิต - โหลดสคริปต์ของฉันย่อขนาดและต่อกันในไฟล์เดียว ด้วย index.html ตามลำดับ: <!DOCTYPE html> <html> <head> <script src="js/MyApp-all.min.js" /> </head> <body></body> </html> คำถามคือฉันจะทำให้เสี้ยงฮึดฮัดแสดงความไม่พอใจทำให้ index.html เหล่านี้ขึ้นอยู่กับการกำหนดค่าเมื่อฉันเรียกใช้grunt …

1
บทบาทของ src และอโฟลเดอร์คืออะไร?
ฉันกำลังดู repo คอมไพล์สำหรับปลั๊กอิน jquery ฉันต้องการเปลี่ยนแปลงบางอย่างเพื่อใช้ในโครงการของฉันเอง แต่เมื่อฉันเปิด Repo ขึ้นมามันมีโครงสร้างที่ฉันไม่เคยเห็นมาก่อน ฉันไม่แน่ใจว่าไฟล์ใดที่จะใช้ / คัดลอกไปยังโครงการของฉันเอง มีโฟลเดอร์ "dist" และ "src" บริการเหล่านี้มีจุดประสงค์อะไร? นี่เป็นสิ่งที่เฉพาะเจาะจงสำหรับ gruntjs หรือปลั๊กอิน jquery หรือไม่? git repo ฉันอยากรู้เกี่ยวกับ: https://github.com/ducksboard/gridster.js

11
แทนที่สตริงในไฟล์ด้วย nodejs
ฉันใช้งานmd5 gruntเพื่อสร้างชื่อไฟล์ MD5 ตอนนี้ฉันต้องการเปลี่ยนชื่อแหล่งที่มาในไฟล์ HTML ด้วยชื่อไฟล์ใหม่ในการเรียกกลับของงาน ฉันสงสัยว่าอะไรเป็นวิธีที่ง่ายที่สุดในการทำเช่นนี้

6
จะทราบได้อย่างไรว่ามีการติดตั้งแพคเกจ npm ทั่วโลกหรือในเครื่อง
ฉันกำลังติดตั้ง grunt, node, npm, bower และ grunt-cli บน windows7 คำแนะนำบอกว่าฉันควรรันคำสั่งติดตั้งด้วยแฟล็ก -g สำหรับโกลบอล ฉันจะตรวจสอบได้อย่างไรว่าฉันใช้แฟล็ก -g เมื่อฉันติดตั้ง จะใช้เวลาในการถอนการติดตั้งและติดตั้งใหม่
154 node.js  gruntjs  npm 

7
npm windows ติดตั้งผลลัพธ์ทั่วโลกใน npm ERR! ภายนอก
ฉันยังใหม่กับความฮึดฮัดและ npm ดังนั้นฉันจึงลองใช้ "ตำรา - ตัวอย่าง" ในเว็บไซต์ " http://tech.pro/tutorial/1190/package-managers-an-introductory-guide-for-the-uninitiated-front-end-developer#front_end_developers " . ตอนนี้คุณไม่ควรไปดูที่นั่น แต่ฉันคิดว่าการแบ่งปันเว็บไซต์จะเป็นการดี จนถึงตอนนี้ดีจนมาถึงการติดตั้งทั่วโลก (ตกลงมีข้อผิดพลาดบางอย่างที่ฉันต้องหา แต่ตอนนี้ฉันใช้งานได้แล้ว) เมื่อมาถึงจุดที่พยายามติดตั้งบางสิ่งบางอย่างทั่วโลกฉันติดขัด สิ่งที่ฉันได้ทำไปแล้วสำหรับการทดสอบการติดตั้งแพ็คเกจบางอย่างทั่วโลก: สร้างไดเรกทอรีทดสอบ grunttest ภายในไดเร็กทอรีนั้น: npm install -g jshint ผลลัพธ์ที่ฉันเห็น: npm http GET https://registry.npmjs.org/jshint npm http 304 https://registry.npmjs.org/jshint ... npm http 304 https://registry.npmjs.org/string_decoder C:\Program Files\nodejs\node_modules\npm\jshint -> C:\Program Files\nodejs\node_modules\npm\node_modules\jshinnt jshint@2.4.4 C:\Program Files\nodejs\node_modules\npm\node_modules\jshint ├── console-browserify@0.1.6 ├── …
121 windows  gruntjs  npm 

2
Task Runners (Gulp, Grunt ฯลฯ ) และ Bundlers (Webpack, Browserify) ทำไมต้องใช้ร่วมกัน?
ฉันเป็นคนใหม่เล็กน้อยสำหรับโลกของนักวิ่งงานและบันเดิลเลอร์และในขณะที่ต้องผ่านสิ่งต่างๆเช่น Grunt, Gulp, Webpack, Browserify ฉันไม่รู้สึกว่ามีความแตกต่างระหว่างพวกเขามากนัก กล่าวอีกนัยหนึ่งฉันรู้สึกว่า Webpack สามารถทำทุกอย่างที่นักวิ่งงานทำ แต่ฉันยังมีตัวอย่างมากมายที่ใช้อึกและ webpack ร่วมกัน ฉันคิดไม่ออกว่าทำไม เมื่อยังใหม่กับเรื่องนี้ฉันอาจจะทำอะไรไปในทิศทางที่ไม่ถูกต้อง จะดีมากถ้าคุณสามารถชี้ให้เห็นว่าฉันขาดอะไรไป ยินดีต้อนรับลิงค์ที่เป็นประโยชน์ ขอบคุณล่วงหน้า.

7
การใช้ node-inspector กับงาน Grunt
มีใครใช้ตัวตรวจสอบโหนดกับGruntสำหรับการดีบักแอปพลิเคชันหรือไม่ ถ้าไม่คุณสามารถแนะนำเครื่องมือดีบั๊กสำหรับแอพที่ใช้ Grunt ได้ไหม ฉันทำงานกับnodejsสำหรับแอปฝั่งเซิร์ฟเวอร์และฉันมีGrunt ที่จะใช้งานที่แยกจากกัน (เนื่องจากผู้ใช้สามารถดำเนินการงานแยกกันได้)

6
ฮึดฮัด: ไม่พบคำสั่งเมื่อเรียกใช้จากเทอร์มินัล
ฉันยังใหม่กับ Grunt ฉันพยายามกำหนดค่า Grunt บน Mac OSX Lion ฉันทำตามคำแนะนำที่นี่แล้วสร้างโฟลเดอร์โครงการที่มีไฟล์ด้านล่าง เมื่อฉันพยายามที่จะดำเนินการโดยพิมพ์ "ทำเสียงฮึดฮัด" command not foundเข้ากับขั้วที่ฉันได้รับ ฉันได้แก้ไขเส้นทางของฉันsudo nano /etc/pathsด้วยโดยหวังว่าการเพิ่มเส้นทางจะทำให้นักวิ่งงานทำงานได้ แต่ก็ยังไม่ทำงาน มีใครสามารถช่วยได้ไหม ---paths /usr/bin /bin /usr/sbin /sbin /usr/local/bin /usr/local/bin/grunt --- files node modules Gruntfile.js package.json
100 gruntjs 

2
ตัวเลือก "ขยาย" ทำอะไรใน grunt-Contrib-copy? ตัวอย่างทั้งหมดใช้ แต่เอกสารไม่ได้บอกว่ามันทำอะไร
นี่คือ README และตัวอย่าง: https://github.com/gruntjs/grunt-contrib-copy/blob/master/README.md นี่คือส่วนที่เกี่ยวข้องของโค้ด (ซึ่งดูเหมือนว่าฉันไม่เข้าใจ) จากhttps://github.com/gruntjs/grunt-contrib-copy/blob/master/tasks/copy.js : module.exports = function (ฮึดฮัด) { 'ใช้อย่างเข้มงวด'; var path = ต้องใช้ ('path'); grunt.registerMultiTask ('copy', 'Copy files.', function () { var kindOf = grunt.util.kindOf; var options = this.options ({ processContent: เท็จ processContentExclude: [] }); var copyOptions = { กระบวนการ: options.processContent, noProcess: options.processContentExclude }; grunt.verbose.writeflags …

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