问题描述
如何添加哈巴狗?保持跟踪和更新哈巴狗的内容并转换为scr文件夹中的html? 是否可以区分任务?观看并构建单独的任务?在此处输入代码
这是我用来创建gulp模板的代码
在此先感谢您帮助我进行大口吃 是否有关于这些问题的详细教程,以后我会遇到什么问题?
const rename = require('gulp-rename');
let project_folder = "dist";
let source_folder = "#src";
let path = {
build: {
html: project_folder + "/",css: project_folder + "/css/",js: project_folder + "/js/",img: project_folder + "/img/",fonts: project_folder + "/fonts/",},src: {
html: [source_folder + "/views/*.html","!" + source_folder + "/views/_*.html"],css: source_folder + "/stylus/style.styl",js: source_folder + "/js/script.js",img: source_folder + "/img/**/*.{jpg,png,svg,gif,ico,webp}",fonts: source_folder + "/fonts/*.ttf",watch: {
html: source_folder + "/**/*.html",css: source_folder + "/stylus/**/*.styl",js: source_folder + "/js/*.js",webp} "
},clean: "./" + project_folder + "/"
}
let { src,dest } = require('gulp'),gulp = require('gulp'),browsersync = require("browser-sync").create();
fileinclude = require("gulp-file-include");
del = require("del");
stylus = require("gulp-stylus");
auto_prefixer = require("gulp-autoprefixer");
group_media = require("gulp-group-css-media-queries");
clean_css = require("gulp-clean-css");
rename_file = require("gulp-rename");
uglify = require("gulp-uglify-es").default;
imagemin = require("gulp-imagemin");
webp = require("gulp-webp");
webphtml = require("gulp-webp-html");
webpcss = require("gulp-webpcss");
svgSprite = require("gulp-svg-sprite");
// pug = require("gulp-pug")
function browserSync(params) {
browsersync.init({
server: {
baseDir: "./" + project_folder + "/"
},port: 3000,notify: false
})
}
function html() {
return src(path.src.html)
.pipe(fileinclude())
.pipe(webphtml())
.pipe(dest(path.build.html))
.pipe(browsersync.stream())
}
function images() {
return src(path.src.img)
.pipe(
webp({
quality: 70
})
)
.pipe(dest(path.build.img))
.pipe(src(path.src.img))
.pipe(
imagemin({
progressive: true,svgoPlugins: [{ removeViewBox: false }],interlaced: true,optimizationLevel: 3 // 0 to 7
})
)
.pipe(dest(path.build.img))
.pipe(browsersync.stream())
}
function css() {
return src(path.src.css)
.pipe(
stylus({
// Сжатие css в dist
compress: false,})
)
.pipe(group_media())
.pipe(
auto_prefixer({
overridebrowserslist: ["last 5 version"],cascade: true
})
)
.pipe(webpcss())
.pipe(dest(path.build.css))
.pipe(clean_css())
.pipe(
rename_file({
extname: ".min.css"
})
)
.pipe(dest(path.build.css))
.pipe(browsersync.stream())
}
function js() {
return src(path.src.js)
.pipe(fileinclude())
.pipe(dest(path.build.js))
.pipe(
uglify()
)
.pipe(
rename_file({
extname: ".min.js"
})
)
.pipe(dest(path.build.js))
.pipe(browsersync.stream())
}
function clean(params) {
return del(path.clean);
}
gulp.task('svgSprite',function() {
return gulp.src([source_folder + '/iconsprite/*.svg'])
.pipe(svgSprite({
mode: {
stack: {
sprite: "../icons/icon.svg",//Название файла для спрайтов
example: true
},}
}))
.pipe(dest(path.build.img))
})
function watchFiles(params) {
gulp.watch([path.watch.html],html);
gulp.watch([path.watch.css],css);
gulp.watch([path.watch.js],js);
gulp.watch([path.watch.img],images);
}
let build = gulp.series(clean,gulp.parallel(html,css,js,images));
let watch = gulp.parallel(build,watchFiles,browserSync);
exports.html = html;
exports.js = js;
exports.css = css;
exports.images = images;
exports.build = build;
exports.watch = watch;
exports.default = watch;```
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)