gulp實用配置(1) demo

2022-07-04 16:21:13 字數 1143 閱讀 2348

在react和vue推進下,現在很多人都在使用webpack作為自動化構建工具,但其實在很多時候我們並不是一定需要用到它,gulp這樣的輕量級構建工具就足夠了。

最近一段時間不是太忙,所以就寫了三份配置,用在不同的情況下。

這篇文章介紹第乙份配置,也是最簡單的乙份。

這份配置我把它稱作demo測試配置,因為在我工作的時候,經常需要快速出效果或者實現某些功能,你沒有時間去自己實現,那麼就需要找一些現有的例子或者外掛程式。

不過這些demo或者外掛程式很多時候需要在移動端檢視或者啟動乙個伺服器,所以這份配置的任務主要就是啟動乙個本地伺服器,可以在移動端和pc端都同時檢視,另外在修改**的時候還能自動重新整理,不用每次都切換應用重新整理,特別是移動端,可以省去很多麻煩。

詳細**如下:

var gulp = require('gulp'),

browsersync = require('browser-sync').create();

//啟動 browsersync 服務,自己啟動server,並且為瀏覽器實時重新整理提供服務

gulp.task('browsersync', function

() ,

files: './demo/**/*',

browser: ["chrome"]

})})//

預設任務,在命令列輸入`gulp`來啟動任務

gulp.task('default', gulp.parallel('browsersync'))

,

"author": "",

"license": "isc",

"devdependencies":

}

xx—

|— demo

|— gulpfile.js

|— package.json

這份配置裡只用到了乙個外掛程式browsersync ,這個外掛程式會啟動乙個localhost伺服器,可以自動重新整理,並且移動端和pc端同步。

browsersync是乙個很強大的外掛程式,這裡有乙份關於它的中文文件,簡單易懂,需要的可以自己檢視。

另外這裡有乙個小技巧就是,我們可以直接通過該外掛程式的配置選項去監聽檔案修改,而不需要使用gulp的watch功能,更加簡單。

gulp實用配置(1) demo

在react和vue推進下,現在很多人都在使用webpack作為自動化構建工具,但其實在很多時候我們並不是一定需要用到它,gulp這樣的輕量級構建工具就足夠了。最近一段時間不是太忙,所以就寫了三份配置,用在不同的情況下。這篇文章介紹第乙份配置,也是最簡單的乙份。這份配置我把它稱作demo測試配置,因...

Wannafly交流賽1 D 迷宮2

這是乙個關於二維格仔狀迷宮的題目。迷宮的大小為n m,左上角格仔座標為 1,1 右上角格仔座標為 1,m 左下角格仔座標為 n,1 右下角格仔座標為 n,m 每一格都用 1到10 9之間的整數表示,意義分別為 1為牆壁,0為走道,而1到10 9之間的正整數代表特殊的走道。蜥蜴最初位於迷宮的座標 1,...

尋找區域性最高點 1D

如題,在1維陣列中,如果乙個數大於或等於左右兩邊相鄰的數,則稱區域性最高點 1d。其中邊界外值為 infty 即最左邊和最右邊只需大於臨近的乙個元素。一種方法是從第乙個元素逐個開始遍歷。演算法複雜度為 t o n t o n t o n 另一種演算法使用二分法。對於乙個點,有以下情況 如下 auth...