❶ gulp壓縮怎麼排除node
通過 gulp.src([...])來控制。
['./**/*.js','!./node_moles/**']
不過一般都是按文件夾來的,你寫的js在哪一個文件夾就指向哪一個文件夾:
比如js文件都 myScript/**/*.js ,則:
gulp.src(['./myScript/**/*.js'])
....
❷ gulp執行壓縮時很慢怎麼實現
1、在任務管理器中(ctrl+alt+delete),選性能,看卡住的時候哪些程序內存佔用過多,cpu使用率過高,內存過多的話,上網查一下是什麼進程,可結束的就結束程序。cpu過高,可試試換操作系統。還可在事件查看器中看系統經常報什麼錯,看能否找出問題。2、W7系統,可下載W7優化大師,優化一下。W8系統有W8優化大師,XP有優化大師。3、W7、W8:開始-運行(輸入msconfig)-回車-引導---高級選項---勾選"處理器個數",選擇最大核心數--勾選"最大內存"--確定。回到系統配置窗口-啟動,保留殺毒軟體和輸入法,其它的全部禁用。4、用金山或者360衛士,在優化系統中打開開機加速,關閉一些你不需要開機啟動的進程。5、進行磁碟碎片整理和磁碟清理。注意:W7不能壓縮C盤來增大空間,否則無法啟動。
❸ gulp壓縮js的時候出現如下錯誤提示 events.js 141,求大神解答!
感覺上是你有代碼在產生錯誤輸出而且沒有被處理。能把具體錯誤的那個文件的代碼發一下嗎?
❹ 為什麼用gulp把多個js文件合並壓縮後,再直接引入頁面就報錯了
合並成一個JS文件之後,代碼的作用域擴大,難免會造成沖突。找到報錯的代碼所在位置,找到原JS文件修改下。
舉個例子:a.js 中有var foo = 1; b.js 中也有 var foo = 10; 那麼合並之後就會有兩個 foo 變數, 這樣一來在新的js文件中,foo的值就是寫在後面的一個,而恰好後面的值會沖突報錯。
因此,在合並之前需要確定每個js文件都能正常工作,而且沒有函數、變數上的沖突。
❺ 前端構建工具Gulp.js 你知多少..(webpack/gulp/grunt)
@ TOC
閱讀本文章之前,相信你已經對前端構建工具(webpack、gulp、grunt)有一定的認知和了解了,那麼他們之間究竟有什麼區別呢?
gulp文檔上面有這么一句話 ,也就是說 gulp是一個自動化構建工具;
gulp的一些功能如下(包括但不限於):
其實Webpack和另外兩個並沒有太多的可比性
傻瓜式起步照搬官網文檔
1.安裝
2.在項目根目錄下創建一個名為 gulpfile.js 的文件:
3.運行 gulp:
默認的名為 default 的任務(task)將會被運行,在這里,這個任務並未做任何事情。
具體詳情可以查看 gulpjs.com文檔
新建一個項目gulp-test
環境:
1.新建文件以下文件如下
其中 gulpfile.js 是我們gulp的配置文件,啟動gulp默認會找個這個文件並執行;
2.接下來安裝依賴
一直按回車Enter初始化package.json文件(小技巧: npm iniy -y 可以免去繁瑣的enter步驟)
此時我們的目錄結構是這樣了
安裝依賴
這里頁面實時刷新只講這個 gulp-connect ,其他詳情可以參照 Browsersync 和文章 gulp-livereload
安裝完依賴後配置gulpfile.js如下:
大概講解一下gulpfile.js:
gulp.task 是gulp的api 定義一個使用 Orchestrator 實現的任務(task)
如上我們定義了 my-task-js , my-task-css , html , clean , default , watch , server 等任務,其中:
my-task-js 是將 符合所提供的匹配模式的js 進行檢測(gulp-jshint)、壓縮(gulp-uglify)、合並(gulp-concat)、重命名(gulp-rename)、輸出(gulp.dest)到/dist/js目錄下;
my-task-css 是將 符合所提供的匹配模式的sass進行編譯(gulp-sass)、壓縮(gulp-uglify)、合並(gulp-concat)、重命名(gulp-rename)、輸出(gulp.dest)到/dist/css目錄下;
html 是將 符合所提供的匹配模式的html進行監聽,如果有變化則connect.reload()
clean 是如果任務重新啟動時 刪除舊文件;
default gulp默認啟動的任務
watch gulp的api 監視文件,並且可以在文件發生改動時候做一些事情。它總會返回一個 EventEmitter 來發射(emit) change 事件。
server 依賴gulp-connect啟動一個伺服器
配置完gulpfile.js之後,我們給js和css及html加點東西:
首先js/helloworld.js
css/index.scss
index.html
運行gulp
瀏覽器效果:
接下來我們修改helloworld.js來看看是否能實時刷新
修改如下:
按保存之後,終端給我們報了一個錯:
查看js發現我們用了es6語法的聲明語句 但當前gulp無法處理es6語法,有問題解決問題,es6=>es5
解決方案:
安裝gulp-babel babel-core babel-preset-es2015
gulpfile.js修改如下:
運行
依然報上面的錯;找了一些原因發現,雖然安裝了相關依賴,卻沒有配置.babelrc文件,即babel還沒轉化es6
根目錄添加.babelrc文件
重新運行:
查看dist下的js文件
改變helloworld.js檢查頁面是否刷新
保存,頁面的天空藍換成你們喜歡的yellow顏色
修改index.scss 查看是否會刷新頁面
最後修改index.html 查看是否會刷新頁面
今天主要學習了gulp的簡單項目搭建及實時更新配置;其實gulp類似於grunt的弱化版,但更簡單好用,只是插件會少一些,目前主流的項目搭建工具主要是webpack,但依然有不少項目還用著gulp或者grunt
擴展:
下面還有一些樓主的學習筆記:
有興趣的可以多多交流@ 樓主博客