เมื่อวิ่งอึก มันรันและคอมไพล์ SASS หนึ่งครั้ง ฉันจะปรับนาฬิกาให้นาฬิกาดูการเปลี่ยนแปลงต่อไปได้อย่างไร ฉันจำเป็นต้องเพิ่ม usePolling: true หรือ usegulp.series ฉันกำลังทำตามคำแนะนำจาก Bootstrap 4 SASS - ชุดเริ่มต้น Barrio
การตั้งค่าของฉัน: ดรูพัลคอร์ 9.1.10 bootstrap_barrio 8.x-4.33 bootstrap_sass 8.x-1.13.1 โหนด v12.22.1 npm 6.14.12 อึกรุ่น CLI: 2.3.0 อึกเวอร์ชันท้องถิ่น: 4.0.2 Vagrant บน Windows โดยใช้เครื่องเสมือน Redhat 7
ให้อึก = ต้องการ ('อึก'),
sass = ต้องการ ('gulp-sass'),
sourcemaps = ต้องการ ('gulp-sourcemaps'),
cleanCss = ต้องการ ('gulp-clean-css'),
เปลี่ยนชื่อ = ต้องการ ('อึกเปลี่ยนชื่อ'),
postcss = ต้องการ ('gulp-postcss'),
autoprefixer = ต้องการ ('autoprefixer'),
browserSync = ต้องการ ('เบราว์เซอร์ซิงค์') สร้าง ()
เส้นทาง const = {
scss: {
src: './scss/style.scss',
ปลายทาง: './css',
ชม: './scss/**/*.scss',
บูตสแตรป: './node_modules/bootstrap/scss/bootstrap.scss'
},
js: {
บูตสแตรป: './node_modules/bootstrap/dist/js/bootstrap.min.js',
jquery: './node_modules/jquery/dist/jquery.min.js',
ป๊อปเปอร์: 'node_modules/popper.js/dist/umd/popper.min.js',
ป๊อปเปอร์: 'node_modules/popper.js/dist/umd/popper.min.js.map'
ปลายทาง: './js'
}
}
// คอมไพล์ sass เป็น CSS & auto-inject ในเบราว์เซอร์
รูปแบบฟังก์ชัน () {
ส่งคืน gulp.src ([paths.scss.bootstrap, paths.scss.src])
.pipe(sourcemaps.init())
.pipe(sass().on('ข้อผิดพลาด', sass.logError))
.pipe(postcss([คำนำหน้าอัตโนมัติ({
เบราว์เซอร์: [
'โครม >= 35',
'ไฟร์ฟอกซ์ >= 38',
'ขอบ >= 12',
'นักสำรวจ >= 10',
'iOS >= 8',
'ซาฟารี >= 8',
'แอนดรอยด์ 2.3'
'แอนดรอยด์ >= 4',
'โอเปร่า >= 12']
})]))
.pipe(sourcemaps.write())
.pipe(gulp.dest(เส้นทาง.scss.dest))
.pipe(cleanCss())
.pipe(เปลี่ยนชื่อ({ คำต่อท้าย: '.min' }))
.pipe(gulp.dest(เส้นทาง.scss.dest))
.pipe(browserSync.stream())
}
// ย้ายไฟล์จาวาสคริปต์ไปที่โฟลเดอร์ js ของเรา
ฟังก์ชัน js () {
ส่งคืน gulp.src ([paths.js.bootstrap, paths.js.jquery, paths.js.popper])
.pipe(gulp.dest(เส้นทาง.js.dest))
.pipe(browserSync.stream())
}
// Static Server + ดูไฟล์ scss/html
บริการฟังก์ชั่น () {
browserSync.init({
พร็อกซี: 'http://orgex1',
เปิด: เท็จ,
})
gulp.watch([paths.scss.watch, paths.scss.bootstrap], ลักษณะ).on('change', browserSync.reload)
}
const build = gulp.series (สไตล์, gulp.parallel (js, เสิร์ฟ))
export.styles = รูปแบบ
exports.js = js
exports.serve = ให้บริการ
exports.default = สร้าง
ผลลัพธ์เมื่อเรียกใช้อึก:
[vagrant@vagrant6 งานนำเสนอ]$ อึก
[15:47:33] การใช้ gulpfile /var/www/html/orgex1/web/themes/custom/presentation/gulpfile.js
[15:47:33] กำลังเริ่มต้น 'ค่าเริ่มต้น'...
[15:47:33] เริ่มต้น 'สไตล์'...
[15:47:37] เสร็จสิ้น 'รูปแบบ' หลังจาก 3.62 วินาที
[15:47:37] กำลังเริ่ม 'js'...
[15:47:37] เริ่ม 'เสิร์ฟ'...
[Browsersync] 3 ไฟล์มีการเปลี่ยนแปลง (bootstrap.min.js, jquery.min.js, popper.min.js.map)
[15:47:37] เสร็จสิ้น 'js' หลังจาก 56 ms
[Browsersync] พร็อกซี: http://orgex1
[Browsersync] เข้าถึง URL:
----------------------------------
ท้องถิ่น: http://localhost:3000
ภายนอก: http://10.0.2.15:3000
----------------------------------
UI: http://localhost:3001
UI ภายนอก: http://localhost:3001
----------------------------------
ฉันพบข้อผิดพลาดของฉัน เนื่องจากฉันใช้ Vagrant บน Windows และกล่อง Centos7 VM เมื่อฉันเรียกใช้คำสั่งอึกบนกล่อง เบราว์เซอร์โฮสต์ Windows ของฉันจะไม่เห็นการเปลี่ยนแปลง CSS ฉันต้องติดตั้ง Nodejs บน Windows จากนั้นรันคำสั่ง gulp ในโฟลเดอร์ธีมของฉันภายใน Windows explorer จากนั้นเบราว์เซอร์ Windows ของฉันจะได้รับการอัปเดต Browsersync และแสดงการเปลี่ยนแปลง CSS
คนส่วนใหญ่ไม่เข้าใจว่าการถามคำถามมากมายจะปลดล็อกการเรียนรู้และปรับปรุงความสัมพันธ์ระหว่างบุคคล ตัวอย่างเช่น ในการศึกษาของ Alison แม้ว่าผู้คนจะจำได้อย่างแม่นยำว่ามีคำถามกี่ข้อที่ถูกถามในการสนทนา แต่พวกเขาไม่เข้าใจความเชื่อมโยงระหว่างคำถามและความชอบ จากการศึกษาทั้ง 4 เรื่องที่ผู้เข้าร่วมมีส่วนร่วมในการสนทนาด้วยตนเองหรืออ่านบันทึกการสนทนาของผู้อื่น ผู้คนมักไม่ตระหนักว่าการถามคำถามจะมีอิทธิพลหรือมีอิทธิพลต่อระดับมิตรภาพระหว่างผู้สนทนา
