由於前面我們都是使用 3.9.1版 來介紹今天要來介紹 4.0 啦~~ gulp4.0 多了 parallel(同時執行) 與 series(依序執行) 且 p...
當我們把 JS 從 ES6+ 語法轉碼成 ES5 後,雖然解決了舊瀏覽器看不懂新語法的需求,但卻還有一個基本需求尚未解決:可不可以把檔案變得更小呢? 答案是可行...
Target: ->解決您Gulp報錯的問題,照片如下。當你出現這問題時,代表您的Gulp版本過高。 Solution: 1.首先先到您的Package....
昨天提到,在 gulp 中使用清除檔案的插件時,我用的本來是 gulp clean,但現在換成了 npm 套件 del,這是因為重新 npm install 時...
在前端工程化的現在,實際放上遠端伺服器給使用者下載的網頁資料夾架構,其實並不等於開發者在本地端所開發的資料夾架構。因此,建構工具時常會臨時產生出一個 temp...
這裡要來先補充一下 確認任務的流程(3種) 加入 return (上篇有提到過) gulp.task('imageMin', function() {...
bower???什麼是 bower?? https://bower.io/ bower 為前端套件管理工具(ex: jQuery,Bootstrap) 這時候...
今天要來介紹 gulp 如何與 bower 結合 這裡必須新增一個套件 main-bower-files https://www.npmjs.com/packa...
若我們要使用外部套件載入的 Sass那要怎麼載入呢?? 這裡我們以 Bootstrap為例子先使用 npm 的方式來載入首先我們先砍掉 bower 載入的 Bo...
npm install --save (產品用)npm install --save-dev (開發用) 以 Heroku 來說它就無法使用 --save-de...
這裡先來介紹兩個套件gulp-clean 與 gulp-sequencehttps://www.npmjs.com/package/gulp-cleanhttp...
Day 19 - 正式開發 Side project 每日一談 嗨,大家好 ! 我是阿蘇今天是 Day19 , 前面有分享很多開發前的切版知識、開發專題前的準...
今天我們要先來介紹Gulp 基本的四個 API 提供使用 gulp.task 執行工作 gulp.src 執行資料來源 guulp.dest 執行結果位置 g...
這裡我們先介紹gulp-clean-css(壓縮css) 與 gulp-uglify(壓縮js) https://www.npmjs.com/package/g...
上一篇有介紹壓縮的一些套件了 不過有時候 我們在開發的時候 有時壓縮 有時不壓縮 那要怎麼解決 所以今天就來介紹 minimist 與 gulp-if 套件 h...
在介紹 gulp 之前當然需要知道 gulp 它是什麼簡單來說gulp 就是 基於node.js的一個前端自動化構建工具 例:可以使用gulp對sass進行預處...
在我們的資料夾內 只會將 source資料夾加入版控 這裡我們就來利用 git 來版控啦~~ 輸入 git init利用 git status 來查看狀態但上述...
browser-sync 由於我們現在瀏覽網頁 是 file的路徑 這樣不太好 所以我們可以使用 browser-sync 解決此問題https://brows...
由於我們前面每加入一個 插件(plugin) 就要引入一次 會發現其實超級麻煩 而且會顯得程式碼非常冗長 所以 gulp-load-plugins 可以解決此問...
在載入 bootstrap 的 js之前 我們可以看到https://getbootstrap.com/docs/4.5/getting-started/int...
Babel 為編譯 ES6 的工具 那我們就要開始介紹如何安裝與使用啦 https://www.npmjs.com/package/gulp-babel...
在介紹 gulp-gh-pages 之前 我們必須先在 GitHub 上新增一個遠端數據庫 點選 New repository 並在終端機 輸入 git rem...
gulp-imageminhttps://www.npmjs.com/package/gulp-imagemin npm install gulp-ima...
昨天我們已經介紹 babel編譯 與 concat合併成一支檔案 但我們還沒介紹 Source Map 的運用 不過在介紹 Source Map 之前 我們先在...