如果gulp不是你们团队的重点,也可以移步我的另一篇文章: 用 webpack 4.0 撸单页/多页脚手架 (jquery, react, vue, typescript) 前言 由于本文重点是介绍gulp4.0...使用 gulp-less ——将less编译成css gulp-file-include ——用于文件模块化导入,如用include的方式导入公共部分 gulp-connect ——用于启动本地服务器...// 不设置allowEmpty: true会报File not found with singular glob return await gulp.src(dist, {allowEmpty...(dist + '/images')); } // clean dir async function clean() { // 不设置allowEmpty: true会报File not found...with singular glob return await gulp.src(dist, {allowEmpty: true}).pipe(Clean()); } module.exports
types 目录用于放置类型声明文件,也可以通过@types/xxx来提供类型声明。 unpkg 和 jsdelivr 用于通过 cdn 访问发布在 npm 上的 umd 内容。..."] // 把清理的过程稍微封装下,便于各个子包都能用上 function cleanDir(dir = "dist", options = {}) { return src(dir, { allowEmpty...: true, ...options }).pipe(clean({ force: true })) } // 暴露出清理 utils 包产物目录的方法 export const cleanUtils...Rollup 本身也支持指定数组或对象形式的 input 参数作为多入口,这和 Webpack 也是相似的。 我们用到一个fast-glob[6],这可以让我们避免繁琐的文件列举。...于是我就考虑加一个buildTypes方法用于单独生成类型声明。
public function rules() { return [ [['attributesl', 'attributes2'],//属性列表数组...] ]; } “validator” 预定义验证表 验证器类 别名 功能描述 BooleanValidator boolean 功能描述确保验证项值是true...RegularExpression Validator match 正则表达式匹配验证 NumberValidator number 有效的数字格式验证 RequiredValidator required 确保验证项不为空...确保验证项在数据库表列中是唯一的 UrlValidator url 有效的URL格式验证 SafeValidator safe 认为该验证项是安全的,以便于块赋值 比如:file 验证图片 图片可以为空、...{ return [ [ 'imgurl', 'file', 'allowEmpty
//加浏览器前缀 gulp-rev-collector //gulp-rev 的插件,用于html模板更改引用路径 目录结构 |- root | |-dist //此目录为下面生成的 | ...'); //gulp-rev 的插件,用于html模板更改引用路径 //清空文件夹 gulp.task('clean', function(){ return gulp.src('dist...>= 4.0'] })) .pipe(csso()) .pipe(rev()) .pipe(gulp.dest('dist/css'))..., interlaced: true, multipass: true })) ...replaceReved: true })) .pipe(htmlMin()) .pipe(gulp.dest(
//将用于检测内部 bean 的早期后处理器注册为 ApplicationListener。...还支持“java.lang.String[]”样式的数组类名和原始类名(例如“boolean”)。委托给 ClassUtils 以进行实际的类名解析。...注意:使用此配置器注册的自定义属性编辑器不适用于数据绑定。...) { this.dateFormat = dateFormat; this.allowEmpty = allowEmpty; this.exactDateLength = -1; }...= dateFormat; this.allowEmpty = allowEmpty; this.exactDateLength = exactDateLength; } @Override
选择捆绑和缩小策略 MVC 和 Razor Pages 项目模板提供了一种用于捆绑和缩小的解决方案,它们构成 JSON 配置文件。...但是,必须认识到,设计时捆绑和缩小会增加生成的复杂性,并且仅适用于静态文件。 配置捆绑和缩小 备注 需要将 BuildBundlerMinifier NuGet 包添加到项目中使其正常工作。...(必需) inputFiles:要捆绑在一起的文件数组。 这些是配置文件的相对路径。 可以选择使用空值,*这将导致输出文件为空。 支持 glob 模式。 - minify:输出类型的缩小选项。...可选,默认值 - false sourceMapRootPath:用于存储所生成的源映射文件的根路径。...)) .pipe(htmlmin({ collapseWhitespace: true, minifyCSS: true, minifyJS: true }))
左图的表单高度单位由于下边空距较大,使用px在不同屏幕显示更加;而右边的活动注册页由于不能出现滚动条,所有的众向高度、margin、padding都应该使用rem。 ...一是只建立一个表单用于数据绑定,点击按钮触发判断;而是有几种登陆方式建立几个表单,用一个字段标识当前显示的表单。...value": "0" } ], "message": "登录要素请求成功" } 可以看到呼和浩特有两种授权登陆方式,我们在data中定义了一个loginWays,初始为空数组...,接着methods中定义一个请求接口的函数,里面就是基于返回数据的基础上为上面fields对象注入一个input字段用于绑定,这就是所谓的基于接口返回数据的属性注入。.../dist', 21 port: 8088, 22 livereload: true, 23 middleware: function(connect,
/" target="_blank" title="Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0)...permalinkClass:用于固定链接锚标记的样式 permalinkSymbol:用于固定链接标记的符号 若想更改 permalinkSymbol 里面符号,可以参考:permalinkSymbol...minifyJS: true, minifyCSS: true, minifyURLs: true, })) .pipe(gulp.dest('....百思不得其解,发现是因为网络上的gulp教程均适用于 gulp 4.0 版本以下 ,如果是安装了最新的gulp 4.0 版本的情况下,则就会进行报错。.../public')); }); // 执行 gulp 命令时执行的任务 // gulp 4.0 适用的方式 gulp.task('build', gulp.parallel('minify-html',
JS语法 代码规范 层级缩进 tab = 4 空格 ; , 后面都空一格空格 运算符 = + - … 前后都空格 每条语句 后面带 ; 表达式 概念: 运算符 与 操作数 运算符 算数运算符: + 、...数组创建 //数组创建 var arr = new Array(10); //方式1 var arr = Array(1,true 'hello');...,index,array){return item==30;}); 或arr.some((item,index,array)=>item == 30) 返回: true或false,源数组不变。...操作相比(obj.xxx = 'xxx') 点操作 className 本操作 直接 class 支持 设置/查看 用户自定义 点操作不支持 removeAttribute() 点操作 无法 移除 只能置空...gulp-uglify : 压缩JS gulp-sass : 编译 sass gulp-minify-css : 最小化 css gulp-rename : 文件重命名 gulp-connect :
那么,在猜想的基础上我们可以尝试修改该数组下可否影响本模块加载依赖的顺序,如果成功自然美丽,如若不成功需寻找更为恰当的解决方案。...(paths); } return [request, paths]; } // 使用eval执行可执行字符串的情况下,parent.id 和parent.filename为空..._resolveLookupPaths函数都会执行,返回一个包含依赖名和可遍历的目录数组(该数组中的目录项可以加载到依赖,也可以无法加载依赖)。最后的工作就是根据Module...._resolveLookupPaths函数返回的结果,遍历目录数组,加载依赖。如果遍历结束后仍没有找到依赖,则抛错。 在分析完源码后,相信大家也都注意了几点信息: Module....每次运行程序都需要提前输入一系列的路径,这种方式将代码的可维护性变为了程序的可维护性,在负责的项目中不适合使用。 尝试三 node运行时给我们提供了一个变量,对,就是process。
当然,gulp可以做到。 gulp是什么? 看完你就明白,这是个自动化构建工具的核心就是gulpfile.js。 用于laravel的gulp怎么写?...gulp.task('compressHtml',['rev'],function () { var options = { removeComments: true,//清除HTML...: true, minifyJS: true, }; return gulp.src(dist+'*.blade.php') .pipe(htmlmin(options...//- 创建一个名为 concat 的 task return gulp.src(paths.css) //- 需要处理的css文件,放到一个字符串数组里 .pipe(rev(.../- 需要处理的css文件,放到一个字符串数组里 .pipe(rev()) //- 文件名加MD5后缀
不适用于隐藏后的代码块( css 设置 display: none)。 社交图标 Butterfly支持font-awesome v6图标。 书写格式:图标名:url || 描述性文字。...post_copyright: enable: true decode: false author_href: license: CC BY-NC-SA 4.0 license_url...前往博客根目录,打开cmd命令窗口执行如下命令安装 gulp 及 gulp-replace。...const gulp = require('gulp'); //如果之前有gulp相关插件,请删除此行代码 const replace = require('gulp-replace'); gulp.task....pipe(gulp.dest('public/')), { overwrite: true }; }); gulp.task("default", gulp.parallel('templates'
在掩码方法中,掩码可以是完全独立的布尔数组,或者它可以在数据表示中占用一个比特,在本地表示值的空状态。...像NaN这样的常见特殊值不适用于所有数据类型。 在大多数情况下,不存在普遍最佳选择,不同的语言和系统使用不同的惯例。...NumPy 确实支持掩码数组吗?也就是说,附加了一个独立的布尔掩码数组的数组,用于将数据标记为“好”或“坏”。Pandas 可能源于此,但是存储,计算和代码维护的开销,使得这个选择变得没有吸引力。...因为它是一个 Python 对象,所以None不能用于任何 NumPy/Pandas 数组,只能用于数据类型为'object'的数组(即 Python 对象数组): import numpy as np...空值上的操作 正如我们所看到的,Pandas 将None和NaN视为基本可互换的,用于指示缺失值或空值。为了促进这个惯例,有几种有用的方法可用于检测,删除和替换 Pandas 数据结构中的空值。
如图: [shili] 左图的表单高度单位由于下边空距较大,使用px在不同屏幕显示更加;而右边的活动注册页由于不能出现滚动条,所有的众向高度、margin、padding都应该使用rem。...1、 只建立一个表单用于数据绑定,点击按钮触发判断 2、有几种登陆方式建立几个表单,用一个字段标识当前显示的表单 由于使用第三方的接口,一开始也没有先进行接口返回数据结构的查看,采用了第一种错误的方式,...value": "0" } ], "message": "登录要素请求成功" } 可以看到呼和浩特有两种授权登陆方式,我们在data中定义了一个loginWays,初始为空数组...,接着methods中定义一个请求接口的函数,里面就是基于返回数据的基础上为上面fields对象注入一个input字段用于绑定,这就是所谓的基于接口返回数据的属性注入。...alert(msg); return; } // 添加input字段用于
除此之外,整个博客的系统日志变迁记录对于运维程序员来说也非常重要,毕竟如果通过发布一篇文章来描述变迁过程并不适合联系起来完整了解。...版权显式声明 (2022年5月18日更新) 之前的版本只会在页面底部的信息栏中显示一个 CC 4.0 的小图标,不是很醒目。...此处,二者都可以置空。 (2022年4月30日更新) 新增全站一键灰度化功能、时间格式配置。在国家公祭日等需要灰度化以示哀悼的时候可以将灰度化配置设置为 true,平常使用默认配置 false。...时间格式这里一共提供了 3 种:第一种中英文站点使用皆宜,第二种适用于英文站点,第三种适用于中文站点。默认时间格式为第一种。...运行环境或依赖库 版本号 NodeJS v17.0.0 gulp v4.0.2 gulp-clean-css v4.3.0 gulp-rename v20.0 gulp-sass v5.0.0 gulp-uglify
智图是腾讯前端团队开发的一个专门用于图片压缩和图片格式转换的平台 可以对png,jpeg,gif等各类格式图片的压缩,以及为上传图片自动选择最优的图片格式,同时,智图平台还会为用户转换一份webp格式的图片...gulp插件使用 (1)安装gulp $ npm install --global gulp (2)安装插件 $ npm install --global gulp-imageisux (3)创建测试项目...test | |-- img |-- test.jpg |-- gulpfile.js gulpfile.js内容 var gulp = require('gulp'); var imageisux...= require('gulp-imageisux'); gulp.task('default', function() { return gulp.src(['img/*'])....pipe(imageisux('',true)); }); 注: imageisux方法有两个参数 第一个参数为存放压缩后图片的路径,为空时默认生成dest webp两个目录 第二个参数为是否生成webp
dir步骤可以让我们切换到其他目录 dir('/tmp'){ deleteDir() } fileExists:判断文件是否存在,结果返回布尔值 isUnix:判断是非为UNIX系统,如果是则返回true...如果为空,则使用操作系统默认的编码 readFile:读取文件 file:路径,同上 encoding:编码,同上 script{ writeFile(file:"base64File", text...如果整个流水线在同一台机器上执行,那stash是多余的,一般用于跨Jenkins node使用。...name:字符串类型,保存文件的集合的唯一标识 allowEmpty:布尔类型,允许stash内容为空 excludes:字符串类型,排除文件,如果排除多个使用「逗号」分隔 includes:字符串类型...设置为true后,无论什么状态码,流水线执行都不受影响 returnStdout:布尔类型,如果为true,任务的标准输出将作为步骤的返回值,而不是打印到构建日志中(如果有错误,则依旧会打印到日志中)
//使用数组的方式来匹配多种文件 gulp.src(['js/*.js','css/*.css','*.html']) 使用数组的方式还有一个好处就是可以很方便的使用排除模式,在数组中的单个匹配模式前加上...是当前定义的任务需要依赖的其他任务,为一个数组。...例如我想要执行one,two,three这三个任务,那我们就可以定义一个空的任务,然后把那三个任务当做这个空的任务的依赖就行了: //只要执行default任务,就相当于把one,two,three这三个任务执行了...适用于任务就是操作gulp.src获取到的流的情况。...return gulp.src('src/images/*') .pipe(imagemin({ progressive: true, use
非空的ASP.NET项目模板默认使用Gulp。...:一个连接多文件在一个文件中的任务 grunt-contrib-uglify:一个压缩和缩小文件尺寸的任务 grunt-contrib-watch:一个检测文件活动的任务 准备项目 首先,创建信的空的...在解决方案管理器中,可以看到项目的目录结构,Src文件夹包含一个空的wwwroot和dependencies节点 ?...module.exports = function (grunt) { grunt.initConfig({ }); }; 在上文的方法中,添加clean任务,这个配置可以添加一个数组来定义要清理的目录或者文件...{ "version": "1.0.0", "name": "GruntFromEmptyWebApp", "private": true, "devDependencies": {
// true 表示 监听文件的变化 watch: true, // 加载的插件项 plugins: [ new...items: [ {message: 'Foo' }, {message: 'Bar' } ] } }) 上面是一个简单的对数组迭代的示例...Event Bus 通信 Event Bus 通信模式是一种更加通用的通信方式,它既可以用于父子组件也可以用于非父子组件。...它的原理就是使用一个空的 Vue 实例作为中央事件总线,通过自定义事件的监听和触发,来完成通信功能 下面我们来看一个具体的实例: 首先定义一个空的 Vue 实例,作为事件总线 import Vue from...delete(key) 删除某个键,返回true。如果删除失败,返回false。 clear() 清除所有成员,没有返回值。
领取专属 10元无门槛券
手把手带您无忧上云