国产99久久精品_欧美日本韩国一区二区_激情小说综合网_欧美一级二级视频_午夜av电影_日本久久精品视频

最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
當前位置: 首頁 - 科技 - 知識百科 - 正文

gulp用法快速記憶

來源:懂視網 責編:小采 時間:2020-11-27 20:00:59
文檔

gulp用法快速記憶

gulp用法快速記憶:本篇文章講述的是gulp的用法有哪些,我們該如何的快速的去記憶gulp的用法,大家對gulp的用法不太了解的同學我們可以一起來看看本篇文章!行文步驟: 1、怎么安裝 2、怎么使用一、怎么安裝 首先你得在自己的電腦中安裝nodejs,應為gulp的運行是基于node
推薦度:
導讀gulp用法快速記憶:本篇文章講述的是gulp的用法有哪些,我們該如何的快速的去記憶gulp的用法,大家對gulp的用法不太了解的同學我們可以一起來看看本篇文章!行文步驟: 1、怎么安裝 2、怎么使用一、怎么安裝 首先你得在自己的電腦中安裝nodejs,應為gulp的運行是基于node
var gutil = require('gulp-util');
gulp.task('default',function(){
 gutil.log('message')
 gutil.log(gutil.colors.red('error'))
 gutil.log(gutil.colors.green('message')+'some')
})

這里寫圖片描述
這里強調以下,gulp操作必須進入到項目文件夾即node_modules文件夾所在界面才能在cmd窗口執行gulp操作。
4、怎樣配置js文件
上面的寫法有一個問題,只要有一個js文件被修改那么所有的js文件都會被重新編譯。
我們只想編譯被修改的文件怎么辦?
使用gulp-watch-path

//引入模塊:var watchPath = require('gulp-watch-path');//設置一個監聽js文件的人物watchjsgulp.task('watchjs',function(){
 gulp.watch('src/js/**/*.js',function(event){
 var paths = watchPath('event','src/','dist/')//監聽所有的js文件,有一個文件發生改變,則返回一個對象,該對象包含被修改js文件的相關屬性。
 /*
 paths對象的結構如下:{srcPath:'src/js/log.js',
 distPath:'dist/js/log.js',
 distDir:'dist/js/',
 srcFilename:'log.js',
 distFilename:'log.js'}
 */ 
 gulp.src(paths.srcPath)
 .pipe( uglify())
 .pipe(gulp.dest(paths.distDir))


})


})

如果我們在編輯源碼的時候出現格式錯誤,怎么輸出這種錯誤?使用stream-combiner2

var handleError = function (err) {
var colors = gutil.colors;
console.log('\n')
gutil.log(colors.red('Error!'))
gutil.log('fileName: ' + colors.red(err.fileName))
gutil.log('lineNumber: ' + colors.red(err.lineNumber))
gutil.log('message: ' + err.message)
gutil.log('plugin: ' + colors.yellow(err.plugin))
}
var combiner = require('stream-combiner2')
gulp.task('watchjs', function () {
gulp.watch('src/js/**/*.js', function (event) {
var paths = watchPath(event, 'src/', 'dist/')

var combined = combiner.obj([
gulp.src(paths.srcPath),
uglify(),
gulp.dest(paths.distDir)
])
combined.on('error', handleError)
})
})

壓縮后的代碼不存在換行符和空白符,導致出錯后很難調試,好在我們可以使用 sourcemap 幫助調試

var sourcemaps = require('gulp-sourcemaps')
// ...
var combined = combiner.obj([
gulp.src(paths.srcPath),
sourcemaps.init(),
uglify(),
sourcemaps.write('./'),
gulp.dest(paths.distDir)
])
// ...

此時 dist/js/ 中也會生成對應的 .map 文件,以便使用 Chrome 控制臺調試代碼

gulp-autoprefixer–解析 CSS 文件并且添加瀏覽器前綴到CSS規則里。在編譯的時候會添加這些前綴

gulp.task('watchcss', function () {
gulp.watch('src/css/**/*.css', function (event) {
var paths = watchPath(event, 'src/', 'dist/')//用于檢測被修改的文件,返回一個對像,該對象包含一些關于被修改文件的屬性。
gulp.src(paths.srcPath)//獲取文件地址
.pipe(sourcemaps.init())//初始化對象,便于后面生成該文件的.map文件
.pipe(autoprefixer({
browsers: 'last 2 versions'
}))//添加前綴
.pipe(minifycss())//執行壓縮功能
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest(paths.distDir))//
輸出文件 }) })

相關推薦:

gulp的入門必知

聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文檔

gulp用法快速記憶

gulp用法快速記憶:本篇文章講述的是gulp的用法有哪些,我們該如何的快速的去記憶gulp的用法,大家對gulp的用法不太了解的同學我們可以一起來看看本篇文章!行文步驟: 1、怎么安裝 2、怎么使用一、怎么安裝 首先你得在自己的電腦中安裝nodejs,應為gulp的運行是基于node
推薦度:
標簽: 快速 使用 用法
  • 熱門焦點

最新推薦

猜你喜歡

熱門推薦

專題
Top
主站蜘蛛池模板: 国产精品区一区二区三 | 国产精品一区视频 | 五月婷婷啪啪 | 一区在线观看 | 欧美在线一区二区三区精品 | 日本韩国一区 | 亚韩在线 | 久久久久久久岛国免费播放 | 日韩精品第一 | 日韩欧美不卡一区二区三区 | 欧美资源在线观看 | 日韩第八页 | 亚洲va国产日韩欧美精品 | 夜夜骑日日操 | 国产每日更新 | 国产精品视频久久久久久 | 欧美 日韩 国产 色 欧美 日韩 中文 | 亚洲视频欧洲视频 | 视频国产精品 | 国产精品久久久久久久久鸭 | 欧美小视频在线观看 | 在线亚洲精品 | 日本三级韩国三级欧美三级 | 国产精品麻豆a在线播放 | 在线国产日韩 | 久久久91精品国产一区二区 | 国产精品成人久久久久 | 99精品国产免费久久国语 | 亚洲第一视频网站 | 欧美日韩精品一区二区三区四区 | 91热成人精品国产免费 | 国语对白91 | 国产一区二区三区精品视频 | 国产精选在线 | 久久免费视频观看 | 国产区最新 | 亚洲视频在线观 | 欧美成人猛男性色生活 | 国内视频一区二区三区 | 国产精品久久一区二区三区 | 91视频一区二区三区 |