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

Gulp เป็นระบบสร้าง JavaScript ซึ่งเป็นทาสก์รันเนอร์ที่ใช้ Node.js เช่น Grunt Gulp ใช้สตรีมและโค้ดโอเวอร์คอนฟิกสำหรับกระบวนการสร้างที่ง่ายและใช้งานง่ายมากขึ้น

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 

13
วิธีการเรียกใช้งาน Gulp ตามลำดับหนึ่ง ๆ
ในตัวอย่างเช่นนี้: gulp.task "coffee", -> gulp.src("src/server/**/*.coffee") .pipe(coffee {bare: true}).on("error",gutil.log) .pipe(gulp.dest "bin") gulp.task "clean",-> gulp.src("bin", {read:false}) .pipe clean force:true gulp.task 'develop',['clean','coffee'], -> console.log "run something else" ในdevelopภารกิจที่ฉันต้องการเรียกใช้cleanและหลังจากเสร็จแล้วให้เรียกใช้coffeeและเมื่อเสร็จแล้วให้เรียกใช้อย่างอื่น แต่ฉันไม่สามารถเข้าใจได้ ชิ้นนี้ไม่ทำงาน กรุณาแนะนำ

30
ไม่ได้โหลดสไตล์ชีทเนื่องจากประเภท MIME
ฉันกำลังทำงานบนเว็บไซต์ที่ใช้gulpในการคอมไพล์และเบราว์เซอร์ซิงค์เพื่อให้เบราว์เซอร์ซิงค์กับการเปลี่ยนแปลงของฉัน งานอึกรวบรวมทุกอย่างถูกต้อง แต่บนเว็บไซต์ฉันไม่เห็นสไตล์ใด ๆ และคอนโซลแสดงข้อความแสดงข้อผิดพลาดนี้: ปฏิเสธที่จะใช้สไตล์จาก ' http: // localhost: 3000 / asset / styles / custom-style.css ' เนื่องจากประเภท MIME ('text / html') ไม่ใช่สไตล์ชีท MIME ที่รองรับและเปิดใช้งานการตรวจสอบ MIME อย่างเข้มงวด ตอนนี้ฉันไม่เข้าใจว่าทำไมสิ่งนี้จึงเกิดขึ้น HTML มีไฟล์เช่นนี้ (ซึ่งฉันค่อนข้างแน่ใจว่าถูกต้อง): <link rel="stylesheet" type="text/css" href="assets/styles/custom-style.css"/> และสไตล์ชีทนั้นเป็นการผสานระหว่างรูปแบบการบูตและแบบอักษรที่ยอดเยี่ยมในตอนนี้ (ยังไม่มีการกำหนดเอง) เส้นทางนี้ถูกต้องเช่นกันเนื่องจากเป็นโครงสร้างโฟลเดอร์: index.html assets |-styles |-custom-style.css แต่ฉันได้รับข้อผิดพลาด มันจะเป็นอะไร? นี่เป็นสิ่งที่ (อาจจะเป็นการตั้งค่าหรือไม่) สำหรับ gulp / …

11
เป็นไปได้ไหมที่จะส่งค่าสถานะไปที่ Gulp เพื่อให้มันทำงานในรูปแบบที่แตกต่างกัน?
โดยปกติในภารกิจอึกมีลักษณะเช่นนี้: gulp.task('my-task', function() { return gulp.src(options.SCSS_SOURCE) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); }); เป็นไปได้หรือไม่ที่จะส่งการตั้งค่าสถานะบรรทัดคำสั่งไปที่อึก (นั่นไม่ใช่งาน) และให้มันรันงานตามเงื่อนไขนั้น ตัวอย่างเช่น $ gulp my-task -a 1 และใน gulpfile.js ของฉัน: gulp.task('my-task', function() { if (a == 1) { var source = options.SCSS_SOURCE; } else { var source = options.OTHER_SOURCE; } return gulp.src(source) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 …
369 javascript  node.js  gulp 

30
วิธีแก้ไข ReferenceError: ไม่ได้กำหนด primordials ในโหนด
ฉันได้ติดตั้งโมดูลโหนดโดยการติดตั้ง NPM แล้วฉันพยายามที่จะเขมือบ sass-watch ในพรอมต์คำสั่ง หลังจากนั้นฉันก็ได้รับคำตอบด้านล่าง [18:18:32] Requiring external module babel-register fs.js:27 const { Math, Object, Reflect } = primordials; ^ ReferenceError: primordials is not defined ลองทำสิ่งนี้ก่อนที่จะเขมือบชม npm -g install gulp-cli
364 node.js  sass  gulp  gulp-sass 


17
ลองติดตั้งใหม่ 'node-sass` บนโหนด 0.12
ฉันต้องการใช้ชุดเริ่มต้นของเว็บ google ผมติดตั้ง v0.12.0 node-sassNode.js, gulpและ จากนั้นจึงวิ่ง: $ sudo npm install เมื่อฉันพิมพ์gulp serveแล้วมีข้อผิดพลาดนี้: Using gulpfile ~/web-starter-kit/gulpfile.js Starting 'styles'... 'styles' errored after 93 ms Error: `libsass` bindings not found. Try reinstalling `node-sass`? at getBinding ฉันติดตั้งใหม่โหนดและอึก แต่มันไม่ได้ช่วย ฉันควรทำอย่างไรต่อไป
263 node.js  sass  gulp 

9
หลังจากติดตั้ง Gulp:“ ไม่พบคำสั่ง 'gulp'”
หลังจากติดตั้งgulp.jsผ่านทาง npm ฉันได้รับno command 'gulp' foundข้อผิดพลาดเมื่อเรียกใช้gulpคำสั่งจากไดเรกทอรีเดียวกันกับที่ติดตั้งไว้ เมื่อดูในnode_modules/.bin/ไดเรกทอรีฉันสามารถเห็นgulpไฟล์ปฏิบัติการได้ มีบางอย่างผิดปกติกับการติดตั้ง npm ของฉันหรือไม่
250 javascript  node.js  npm  gulp 

2
ไม่รวมไฟล์ / ไดเรกทอรีจากภารกิจอึก
ฉันมีงานอึก rjs ที่เชื่อมต่อและทำให้ไฟล์. JSS ที่กำหนดเองของฉัน (libraries ไม่ใช่ไลบรารีผู้จำหน่าย) สิ่งที่ฉันพยายามทำคือแยกบางไฟล์ / ไดเรกทอรีออกจากงานนี้ (ตัวควบคุมและคำสั่ง) นี่คือต้นไม้ของฉัน: - application - resources - js main.js - vendor - jquery - modernzr - angular - controllers - controller1 - controller2 - controller3 - directives - directives1 - directives2 - directives3 - widgets - widget1 - widget2 - …

30
ไม่พบคำสั่ง gulp - เกิดข้อผิดพลาดหลังจากติดตั้ง gulp
ฉันได้ติดตั้งอึกทั้งในระดับโลกและในประเทศโดยใช้ npm install gulp npm install gulp -g npm install gulp-util npm install gulp-util -g เมื่อพยายามที่จะเรียกใช้อึกฉันได้รับ 'gulp' is not recognized as an internal or external command, operable program or batch file. ใช้ gulp รายการ npm (หรือ -g) ฉันgulp@3.7.0มีตำแหน่งของการติดตั้ง gulp ทั่วโลกหรือในพื้นที่ของฉัน ฉันได้พยายามทำงานnode gulpfile.jsชี้ไปที่ gulpfile require('gulp')ของฉันและมันทำงานโดยไม่มีข้อผิดพลาดและแน่นอนมันเริ่มต้นด้วย มีข้อเสนอแนะใด ๆ เกี่ยวกับการอึกทำงานบน Windows (8.1)?
223 windows  node.js  gulp 

16
ข้อผิดพลาดอึก: งานต่อไปนี้ไม่เสร็จสมบูรณ์: คุณลืมที่จะส่งสัญญาณให้เสร็จสิ้น async?
ฉันมีgulpfile.jsต่อไปนี้ซึ่งฉันกำลังดำเนินการผ่านข้อความบรรทัดคำสั่งgulp : var gulp = require('gulp'); gulp.task('message', function() { console.log("HTTP Server Started"); }); ฉันได้รับข้อความแสดงข้อผิดพลาดต่อไปนี้: [14:14:41] Using gulpfile ~\Documents\node\first\gulpfile.js [14:14:41] Starting 'message'... HTTP Server Started [14:14:41] The following tasks did not complete: message [14:14:41] Did you forget to signal async completion? ฉันใช้อึก 4 ในระบบ Windows 10 นี่คือผลลัพธ์จากgulp --version: [14:15:15] CLI version …
211 gulp 

5
วิธีการป้องกัน moment.js จากการโหลดสถานที่ด้วย webpack?
มีวิธีใดที่คุณสามารถหยุดไม่ให้moment.jsโหลดโลแคลทั้งหมด (ฉันต้องการภาษาอังกฤษ) เมื่อคุณใช้เว็บแพค? ฉันกำลังดูแหล่งที่มาและดูเหมือนว่าหากhasModuleมีการกำหนดไว้ซึ่งเป็นของ webpack ก็จะพยายามrequire()ทุกสถานที่ ฉันค่อนข้างมั่นใจว่าต้องมีคำขอดึงเพื่อแก้ไข แต่มีวิธีใดบ้างที่เราสามารถแก้ไขได้ด้วยการกำหนดค่า webpack นี่คือ webpack config ของฉันที่จะโหลดโมเมนต์ js: resolve: { alias: { moment: path.join(__dirname, "src/lib/bower/moment/moment.js") }, }, require('moment')จากนั้นทุกที่ฉันต้องการมันผมก็ทำ ใช้งานได้ แต่กำลังเพิ่มไฟล์ภาษาที่ไม่ต้องการลงในบันเดิลของฉันประมาณ 250 kB นอกจากนี้ฉันกำลังใช้รุ่นชั่วครู่ของซุ้มประตูและอึก นอกจากนี้หากไม่สามารถแก้ไขได้โดยการกำหนดค่าเว็บแพคนี่เป็นลิงค์ไปยังฟังก์ชั่นที่โหลดโลแคล ฉันพยายามเพิ่ม&& module.exports.loadLocalesไปยังifคำสั่ง แต่ฉันเดา webpack ไม่จริงทำงานในลักษณะที่ว่าจะทำงาน มันก็requires ไม่ว่าสิ่งที่ ฉันคิดว่ามันใช้ regex ตอนนี้ดังนั้นฉันไม่รู้จริงๆว่าคุณจะแก้ไขได้อย่างไร

11
ส่งผ่านพารามิเตอร์ไปที่งานอึก
gulp mytaskปกติเราสามารถเรียกใช้งานอึกจากคอนโซลผ่านสิ่งที่ต้องการ มีอยู่หรือไม่ที่ฉันสามารถส่งผ่านพารามิเตอร์ให้กับงานอึก? ถ้าเป็นไปได้โปรดแสดงตัวอย่างว่าสามารถทำได้
194 gulp 

17
สคริปต์ Concat เรียงตามลำดับด้วย Gulp
กล่าวว่าสำหรับตัวอย่างเช่นคุณกำลังสร้างโครงการ Backbone หรืออะไรก็ตามและคุณจำเป็นต้องโหลดสคริปต์ในลำดับที่แน่นอนเช่นจะต้องมีการโหลดก่อนunderscore.jsbackbone.js ฉันจะทำให้มันเป็นบทสรุปได้อย่างไรเพื่อที่พวกเขาจะได้อยู่ในระเบียบ? // JS concat, strip debugging and minify gulp.task('scripts', function() { gulp.src(['./source/js/*.js', './source/js/**/*.js']) .pipe(concat('script.js')) .pipe(stripDebug()) .pipe(uglify()) .pipe(gulp.dest('./build/js/')); }); ฉันมีลำดับที่ถูกต้องของสคริปต์ในของฉันsource/index.htmlแต่เนื่องจากไฟล์ถูกจัดเรียงตามลำดับตัวอักษร gulp จะต่อกันunderscore.jsหลังจากbackbone.jsนั้นและลำดับของสคริปต์ในของฉันsource/index.htmlไม่สำคัญมันจึงดูที่ไฟล์ในไดเรกทอรี ดังนั้นใครมีความคิดเกี่ยวกับเรื่องนี้? คิดที่ดีที่สุดที่ฉันได้เป็นสคริปต์ที่จะเปลี่ยนชื่อผู้ขายที่มี1, 2, 3เพื่อให้พวกเขาสั่งซื้อที่เหมาะสม แต่ผมไม่แน่ใจว่าถ้าฉันเช่นนี้ เมื่อฉันเรียนรู้เพิ่มเติมฉันพบว่า Browserify เป็นวิธีแก้ปัญหาที่ยอดเยี่ยมมันอาจเป็นความเจ็บปวดในตอนแรก แต่มันก็ยอดเยี่ยม
192 javascript  gulp 

10
วิธีดูและโหลดซ้ำโหนดเมื่อไฟล์ TypeScript เปลี่ยน
ฉันพยายามเรียกใช้เซิร์ฟเวอร์ dev ด้วย TypeScript และแอปพลิเคชัน Angular โดยไม่มีการแปลงไฟล์ ts ทุกครั้ง ฉันพบว่าฉันสามารถทำงานได้ด้วยts-nodeแต่ฉันยังต้องการดู.tsไฟล์และโหลดแอป / เซิร์ฟเวอร์อีกครั้งเหมือนที่ฉันทำกับสิ่งที่ชอบดูอึก

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