筱淑
筱淑

gulp核心知识点目录

gulp

文章目录

  • gulp
          • gulp 就是一种可以自动化完成我们开发过程中大量的重复工作
  • gulp是一个前端自动化构建工具。
  • 创建一个简单的应用
  • gulp的安装
  • 常用的gulp插件
          • 扩展的插件
          • 下载插件
          • 配置插件
  • 方法使用
          • - //注册任务
          • - //读文件
          • - //输出文件
          • - //监听文件变更
          • - //设置执行任务顺序（串行）
          • - //注册多个任务
  • 查找规则 说明
  • 应用gulpfile.js
        • 编译scss 与sass
        • 编译less
          • 自动添加前缀
          • 合并文件
          • 压缩css
        • 压缩html
          • 压缩图片
        • 压缩js
        • 编译es6
          • md5 添加前缀
          • 代理

  • 不再是简单的使用HTML + CSS + JavaScript 这些技术去构建网页应用。
  • 我们要提高效率，就必须减少重复的工作。
  • 使用less之类预处理的css
  • 提供开发阶段更加便利，更加快捷
gulp 就是一种可以自动化完成我们开发过程中大量的重复工作
  • 预处理语言的编译
  • js css html 压缩混淆
  • 图片体积优化

gulp是一个前端自动化构建工具。

  • gulp类似的工具：grunt 、webpack
  • gulp是基于node体系的。
  • gulp优点：
    • 易于使用
    • 构建快速
    • 插件高质
    • 易于学习

创建一个简单的应用

  • gulpfile.js —gulp配置文件

gulp的安装

  • 安装nodejs,查看版本：node -v
  • 全局安装gulp
  • cnpm install gulp -g
  • 局部安装gulp
  • cnpm install gulp --save-dev (开发依赖包)

常用的gulp插件

插件名 功能
gulp-sass 编译scss
gulp-less 编译less
gulp-autoprefixer 自动添加前缀
gulp-concat 合并文件
gulp-clean-css 压缩css
gulp-webserver 起服务
gulp-htmlmin 压缩html
gulp-imagemin 压缩图片
gulp-uglify 压缩js 不支持ES6
gulp-babel ES6—>ES5
gulp-rev 生成文件后缀
gulp-rev-collector 替换文件路径
gulp-rename 文件重命名
gulp-babel 编译JS（ES6—>ES5）

  • 注：使用 babel（安装成7.0的版本） 需要babel-core和babel-preset-es2015

  • cnpm install gulp-babel@7 babel-core babel-preset-env/es2015 -g

扩展的插件
  • https://www.npmjs.com/
下载插件
  • $ cnpm install gulp-concat gulp-uglify gulp-rename --save-dev （多个插件同时下载）
  • $ cnpm install gulp-less gulp-clean-css --save-dev
配置插件
  • //gulpfile.js
  • var concat = require(‘gulp-concat’);
  • var uglify = require(‘gulp-uglify’);
  • var rename = require(‘gulp-rename’);
  • var less = require(‘gulp-less’);
  • var sass = require(‘gulp-sass’);
  • var cleanCss = require(‘gulp-clean-css’);

方法使用

- //注册任务
  • gulp.task(‘任务名’,function(){
  • //逻辑具体任务
  • })
- //读文件
  • gulp.src(“目标文件路径”)
- //输出文件
  • gulp.dest(“输出的文件路径”)
  • //可以理解为管道，将操作加入到执行队列。
  • gulp.pipe()
- //监听文件变更
  • gulp.task(‘任务名’, function () {
  • gulp.watch('监听文件目录', gulp.series('任务名', '任务名'...));
  • })
- //设置执行任务顺序（串行）
  • gulp.series(“任务名”,“任务名”…)
  • //设置执行任务顺序（并行）
  • gulp.parallel(“任务名”,“任务名”…)
- //注册多个任务
  • gulp.task(‘default’, gulp.series(“任务名”…));

查找规则 说明

查找规则 说明
* 查找所有的
** 匹配的0个或多个文件夹
{,} 匹配多个文件，或多个属性
！ 非

应用gulpfile.js

  • gulpfile.js
  • //引入模块
  • var gulp = require(‘gulp’);
  • //注册转换less的任务
  • gulp.task(‘less’,function(){
  • return gulp.src('src/less/*.less')

  • .pipe(less()) //使用less对象进行编译

  • .pipe(gulp.dest('src/css'))编译的的结果保存到目录
  • })
  • //注册转换sass的任务
  • gulp.task(‘sass’,function(){
  • return gulp.src("src/scss/*.scss")

  • .pipe(sass()) //进行编译

  • //自动处理浏览器前缀 

  • .pipe(autoprefixer({

  •     browsers: ['last 2 versions', 'Android >= 4.0'], //浏览器版本

  •     cascade: true, //是否美化属性值 默认：true 

  •     remove:true //是否去掉不必要的前缀 默认：true 

  • }))

  • .pipe(gulp.dest('dist/'))
  • })
  • //注册合并压缩js的任务
  • gulp.task(‘js’,function(){
  • return gulp.src("src/js/**/*.js") //找到目标原文件，将数据读取到gulp的内存中

  • .pipe(concat('build.js'))//合并临时文件

  • .pipe(gulp.dest('dist/js/'))//输出文件到本地路径

  • .pipe(uglify())//压缩文件

  • .pipe(rename('build.min.js'))//重命名第一种情况

  • .pipe(rename({suffix:'.min'})) //重命名第二种情况;suffix:后缀名

  • .pipe(gulp.dest("dist/js/"))
  • })
  • /*
    • 编译js文件，合并js，并且压缩
    • es6 - es5
    • 需要gulp-babel和babel-core和babel-preset-es2015
    • $ cnpm install gulp-babel@7 babel-core babel-preset-es2015 -g
  • */
  • gulp.task(‘js’,function(){
  • return gulp.src('./src/js/style/*.js')

  • .pipe(babel({

  •     presets:'es2015'

  • }))  //编译es6 -es5

  • .pipe(concat("all.js")) //合并

  • .pipe(uglify()) //压缩

  • .pipe(gulp.dest('./src/js/'))
  • })
  • //注册压缩html的任务
  • gulp.task(‘htmlMin’, () => {
  • //removeComments: true,//清除HTML注释

  • //collapseWhitespace: true,//压缩HTML

  • return gulp.src('index.html')

  •   .pipe(htmlmin({collapseWhitespace: true,removeComments: true,}))

  •   .pipe(gulp.dest('dist/'));
  • });
  • //开启服务
  • gulp.task(‘server’,function(){
  • return gulp.src('src')

  • .pipe(webserver({

  •     port:9090, //端口号

  •     open:true, //自动打开浏览器

  •     livereload:true, //自动打开刷新

  •     proxies:[  //代理

  •         { source:'/api/find',target:'http://localhost:3000/api/find'}

  •     ]   

  • }))
  • })
  • //开发坏境（串联）
  • gulp.task(‘dev’,gulp.series(‘任务名’,‘任务名’))
  • //线上环境（并联）
  • gulp.task(‘build’,gulp.parallel(‘任务名’,‘任务名’))
  • 执行 --> gulp 任务名
  • 一些参数
  • last 2 versions: 主流浏览器的最新两个版本
  • last 1 Chrome versions: 谷歌浏览器的最新版本
  • last 2 Explorer versions: IE的最新两个版本
  • last 3 Safari versions: 苹果浏览器最新三个版本
  • Firefox >= 20: 火狐浏览器的版本大于或等于20
  • iOS 7: IOS7版本
  • Firefox ESR: 最新ESR版本的火狐
  • 5%: 全球统计有超过5%的使用率
  • 在 package 文件中scripts字段添加dev 和 build 两个命令
  • {
  • “scripts”: {
  • "dev": "gulp dev",// npm run dev 开发

  • "build": "gulp build" // npm run build
  • },
  • “devDependencies”: {
  • "gulp-sass": "^4.0.2",

  • "gulp-webserver": "^0.9.1"
  • }
  • }

编译scss 与sass

 "gulp-sass": "^3.1.0"

var gScss = require('gulp-sass');
gulp.task('scss1', function() {
    return gulp.src('./origin/*.scss') //指定scss文件 
        .pipe(gScss())//调用引入的文件 它抛出的是一个函数执行就行
        .pipe(gulp.dest('./detection'));
});

编译less

 "gulp-less": "^3.4.0"

var gLess = require('gulp-less');
gulp.task('less', function() {
    return gulp.src('./origin/*.less')
        .pipe(gLess())
        .pipe(gulp.dest('./detection/'));
});
自动添加前缀
gulp-autoprefixer

var autoprefixer = require("autoprefixer");
gulp.task('autopre', function() {
    return gulp.src("src/css/*.css")
        .pipe(autoprefixer({
            browsers: ['last 2 versions'] //离你最近的两个浏览器版本
        )) 
        .pipe(gulp.dest("dist")); //生成新文件
})
合并文件
gulp-concat

var concats = require('gulp-concat');
gulp.task('concat', function() {
    return gulp.src('./detection/*.css') //需要合并的文件
        .pipe(concats('all.css')) //合并后的文件名
        .pipe(gulp.dest('./dest/')); //合并后存贮的位置
});
压缩css
 "gulp-clean-css"

var miniCss = require('gulp-clean-css');
gulp.task('minicss', function() {
    return gulp.src('./detection/style.css')
        .pipe(miniCss())
        .pipe(gulp.dest('./zlib/'));
});

gulp-webserver
gulp.src("./目录")

port ：配置端口号
open: 自动打开浏览器（true）
livereload: 自动刷新（true）
host: 配置IP(localhost是默认值)
fallback: 指定默认打开的文件(index.html默认)
middleware:function(req,res,next){ //拦截前端请求
    next表示执行下一个，移交控制权
}

压缩html

"gulp-htmlmin": "^4.0.0"

var miniHtml = require('gulp-htmlmin');
gulp.task('miniH', function() {
    return gulp.src('./detection/index.html')
        .pipe(miniHtml({
            collapseWhitespace: true, //压缩HTML
          
        }))
        .pipe(gulp.dest('./zlib/'))
});

miniHtml参数

{
    removeComments: true,//清除HTML注释
    collapseWhitespace: true,//压缩HTML
    collapseBooleanAttributes: true,//省略布尔属性的值  ==> 
    removeEmptyAttributes: true,//删除所有空格作属性值  ==> 
    removeScriptTypeAttributes: true,//删除

你可能感兴趣的:(gulp,打包压缩)

  • Docker下载，包含Win、Mac 码码哈哈0.0 实用工具docker容器运维
    介绍Docker是一种开源的容器化平台，通过操作系统级虚拟化技术实现应用的快速开发、部署和运行。以下从多个维度对Docker进行详细介绍：一、Docker的核心概念与功能容器化技术Docker利用Linux内核的容器隔离技术（如Cgroups和Namespace），将应用及其依赖打包为轻量级、可移植的容器。容器与虚拟机不同，它无需模拟完整操作系统，而是共享主机内核，因此启动更快、资源占用更低。核心
  • 【运维的七种武器】 搞技术的季 运维
    最近项目陆续增加，相应的运维方面压力逐步攀升，经常出现打包和发布失败的情况，给交付团队带来困扰。运维技术是随着软件技术的发展同步发展起来的，当前复杂的软件技术架构对运维的稳定和高效带了了很大挑战。一、运维平台发展史：1.第一阶段，以专业化网管工具为代表，包括网络设备、主机、数据库、中间件、存储等进行专业监控管理的各种专业化工具。2.第二阶段，以ITIL流程化管理为代表的综合网管，通过事件、服务、流
  • Centos7软件包管理(rpm、yum) Bulut0907 Linuxcentos软件包管理rpmyumyum源修改
    目录1.rpm2.yum2.1修改yum源1.rpmRPM(RedHatPackageManager)，redhat系列操作系统里面的打包安装工具查询命令：查询安装的所有rpm软件包：rpm-qa查询指定rpm软件包，并显示详细信息：rpm-qipython3卸载命令：卸载软件包，不管是否有其它软件包依赖该软件包：rpm-e--nodeps软件包名称安装命令：安装rpm包，并显示详细信息和进度条(
  • Webpack 中动态导入（Dynamic Import）的几种典型用法 混血哲谈 webpack前端node.js
    这段代码展示了Webpack中动态导入（DynamicImport）的几种典型用法，并通过Webpack魔法注释（MagicComments）对打包行为进行精细控制。以下是逐段解析：1.单一目标模块的动态导入import(/*webpackChunkName:"my-chunk-name"*///指定生成的chunk名称/*webpackMode:"lazy"*///延迟加载模式/*webpack
  • 【typescript进阶篇】(第四章) webpack编译ts及第三方库声明文件 蒜香拿铁 typescript系列typescriptwebpackjavascript
    使用webpack打包TS文件安装依赖安装webpack环境npmiwebpackwebpack-cliwebpack-dev-server-D安装TypeScriptnpminstalltypescript-D编译TSnpminstallts-loader-D热更新服务npminstallwebpack-dev-server-DHTML模板npminstallhtml-webpack-plugi
  • webpack提升打包构建速度02--webpack优化 _xiyang webpackwebpack前端node.jsjavascript
    提升打包构建速度HotModuleReplacement为什么开发时我们修改了其中一个模块代码，Webpack默认会将所有模块全部重新打包编译，速度很慢。所以我们需要做到修改某个模块代码，就只有这个模块代码需要重新打包编译，其他模块不变，这样打包速度就能很快。是什么HotModuleReplacement（HMR/热模块替换）：在程序运行中，替换、添加或删除模块，而无需重新加载整个页面。怎么用1.
  • HBuilderX的下载、安装 听海边涛声 HBuilderX
    HBuilderX简称HX，是一款轻量级的、免费的IDE。它具有强大的语法提示和vue支持。访问HBuilderX的官网：https://www.dcloud.io/hbuilderx.html选择要下载的版本，我下载的是v4.08版本：将压缩包下拉以后解压到某个目录下就可以了，不需要安装过程，例如，我解压到D:\HBuilderX目录下面：双击HBuilderX.exe，就可以运行了：注意：HB
  • Hadoop（在Linux中安装jdk） 錠诗味 linuxhadoop运维
    安装之前需准备：1.需要远程连接软件2.需要jdk3.需要准备两个文件夹01/export/software安装包02/export/servers解压文件夹现在正式开始安装1.将压缩包存放在/export/software目录下2.进入到software目录进行解压cd/export/software（切换目录）tar-zxvfjdk-8u202-linux-x64.tar.gz-C/expor
  • Spring Boot项目开发常见问题及解决方案（上） 小芬熊 面试学习路线阿里巴巴springboot后端java
    启动相关问题问题1：项目启动时报错“找不到主类”在使用SpringBoot打包成可执行JAR文件后启动，有时会遇到这个头疼的问题。通常是因为打包配置有误或者项目结构不符合要求。解决方案：首先，检查pom.xml（Maven项目）或build.gradle（Gradle项目）中的打包插件配置。确保spring-boot-maven-plugin（Maven示例）配置正确，比如：org.springf
  • 使用Jmeter进行接口测试的基本步骤有哪些？ 海姐软件测试 Jmeter测试工具职场和发展面试
    使用JMeter进行接口测试通常包含以下基本步骤：1.环境准备下载与安装：访问ApacheJMeter的官方网站（ApacheJMeter-ApacheJMeter™）下载适合你操作系统的JMeter版本，解压下载的压缩包到指定目录。启动JMeter：在解压后的目录中，找到bin文件夹，根据操作系统不同，双击jmeter.bat（Windows）或jmeter.sh（Linux/Mac）启动JMe
  • CentOS 7系统中hadoop的安装和环境配置 代码小张z centoshadooplinux
    1.创建Hadoop安装解压路径：mkdir-p/usr/hadoop2.进入路径：cd/usr/hadoop3.下载安装包（我这里用的是阿里云镜像压缩包）：wgethttps://mirrors.aliyun.com/apache/hadoop/common/hadoop-3.3.5/hadoop-3.3.5.tar.gz4.解压安装包到hadoop文件路径：tar-zxvf/usr/hadoo
  • 算力技术演进与多场景融合路径 智能计算研究中心 其他
    内容概要算力技术的演进正经历从异构计算到量子计算的范式跃迁。当前技术图谱中，芯片制程突破与架构创新持续推动算力密度提升，如5nm以下先进工艺与存算一体设计显著增强运算单元效率。与此同时，模型压缩、数据预处理等算法优化手段使单位算力产出提高30%以上。典型应用场景中，工业互联网通过自适应计算实现毫秒级实时控制，医疗影像领域借助分布式计算完成TB级数据处理，而智能安防系统依托边缘计算降低端到端时延至5
  • 下一代模型技术演进与场景应用突破 智能计算研究中心 其他
    内容概要当前模型技术正经历多维度的范式跃迁，可解释性模型与自动化机器学习（AutoML）成为突破传统黑箱困境的核心路径。在底层架构层面，边缘计算与量子计算的融合重构了算力分配模式，联邦学习技术则为跨域数据协作提供了安全可信的解决方案。主流框架如TensorFlow和PyTorch持续迭代优化能力，通过动态参数压缩与自适应超参数调优策略，显著提升模型部署效率。应用层创新呈现垂直化特征，医疗诊断模型通
  • 深入了解Python的shutil模块 上官美丽 技术分享python
    在Python编程中，处理文件和目录是一个常见的需求。而shutil模块就像一个得力助手，专门用于文件和目录的操作！这篇文章将带你深入探索shutil模块的各种功能，让你在管理文件时游刃有余。什么是shutil模块？shutil是Python的一个标准库，主要用于高效地处理文件和目录。这个模块提供了很多有用的功能，比如复制、移动、删除文件，甚至可以压缩和解压文件！无论你是要整理文档、备份数据，还是
  • Maven Deploy Plugin如何使用？ 上官美丽 javamavenjava
    在Java开发中，Maven是一个非常重要的构建工具。它不仅可以管理项目的依赖关系，还能帮助我们打包和发布项目。在Maven中，deploy插件是一个很实用的功能，它可以将构建好的项目发布到远程仓库。今天，就来聊聊如何使用MavenDeployPlugin，帮助你更好地掌握这个工具！什么是MavenDeployPlugin？MavenDeployPlugin是Maven的一部分，主要用于将构建好的
  • MySQL 8.0 特性的高频面试题及核心知识点 dblens 数据库管理和开发工具 mysqlmysql数据库面试题
    1.索引原理与MySQL8.0新特性答案：自适应哈希索引：MySQL8.0自动在频繁查询的索引上构建哈希索引，加速等值查询（如WHEREid=1）。全文索引优化：支持布尔模式（MATCH()AGAINST()）和自然语言模式，且索引更新更高效。InnoDB页压缩：支持ZSTD压缩算法，减少存储空间和I/O开销。虚拟列索引：可对虚拟列（ComputedColumns）创建索引，减少存储冗余。2.事务
  • 实现图片压缩功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于imagePackerssApi实现了图片压缩功能，并将压缩后的图片转成base64格式。开发者可将压缩后的图片用于arkui或者H5中进行图片展示。实现图片压缩功能源码链接效果预览使用说明打开应用，展示选择图片并压缩按钮，点击按钮，拉起系统相册，相册里选择图片或者拍照获取图片，选择完毕后点击完成，即可返回应用主页面，展示压缩后的图片。实现思路构造sel
  • 【第11章】亿级电商平台订单系统-海量数据架构设计 cherry5230 架构系统架构架构分布式
    1-1本章导学课程导学课程定位：大型系统架构设计核心难点解析核心项目：BToB电商平台订单系统（年交易额200亿级）本章知识体系1.核心概念辨析海量数据vs大数据本质区别解析常见认知误区说明2.方法论框架海量数据处理核心思想分布式计算原理数据分片策略弹性扩展机制3.数据库架构设计方法论体系读写分离模式分库分表策略数据分区方案缓存层设计4.数据处理体系海量数据处理之道批处理与流处理数据压缩技术异步处
  • 最完整的webpack Dll打包与采坑总结 仰望星空的代码 Vue.js踩坑记vue.jswebpackdll打包打包优化
    webpack已经成为前端主流的项目打包工具，对于前端开发必不可少。在前端项目依赖第三方库过多，项目比较大文件比较多时，webpack打包的速度也会被拖成蜗牛，是时候优化一下webapck的打包速度了。在优化打包速度方面有不少方法方式，其中一个比较重要的方式是DllPlugin。DllPlugin把第三方库打包成动态链接库（动态链接库：windows系统中库文件概念，这里是借用了这一概念。），Dl
  • 前端开发：Webpack的使用总结 三掌柜666 web前端知识汇总webpack前端javascript
    前言在前端开发过程中，尤其是现在前端框架的频繁使用的当下，作为前端开发者想必对于Webpack并不陌生，尤其是在使用Vue框架做前端开发的时候，打包时候必用Webpack。还有就是在前端求职面试的时候，Webpack相关的知识点也是面试官必定考察的，那么本篇博文就来分享一下关于Webpack使用相关的知识点，记录下来，方便后期查阅使用。Webpack概念Webpack其实是一个前端资源加载/打包工
  • GGUF量化模型技术解析与DeepSeek-R1-Distill-Llama-8B选型指南 每天三杯咖啡 人工智能
    ```markdown#【完全指南】GGUF量化技术与DeepSeek-R1模型选型：从入门到部署##什么是模型量化？（小白扫盲版）###1.1量化就像"模型减肥术"-**传统模型**：每个参数用32位浮点数（好比高清无损图片）-**量化模型**：用4-8位整数存储（类似手机压缩照片）-**核心原理**：`FP32→Int8/Int4`的数学映射，保留关键特征###1.2为什么要量化？|对比项|原
  • 鸿蒙HarmonyOS实战：应用程序包-HAP 让开，我要吃人了 harmonyos华为
    HAP（HarmonyAbilityPackage）是应用安装和运行的基本单元。HAP包是由代码、资源、第三方库、配置文件等打包生成的模块包，其主要分为两种类型：entry和feature。entry：应用的主模块，作为应用的入口，提供了应用的基础功能。feature：应用的动态特性模块，作为应用能力的扩展，可以根据用户的需求和设备类型进行选择性安装。应用程序包可以只包含一个基础的entry包，也
  • 鸿蒙HarmonyOS 5.0开发：应用程序包-HAP 炫酷盖茨猫先生 鸿蒙5.0开发ArkTS组件ArkUI框架harmonyos华为前端androidArkUIArkTS鸿蒙系统
    往期鸿蒙全套实战文章必看：（文中附带鸿蒙全栈学习资料）鸿蒙开发核心知识点，看这篇文章就够了最新版！鸿蒙HarmonyOSNext应用开发实战学习路线鸿蒙HarmonyOSNEXT开发技术最全学习路线指南鸿蒙应用开发实战项目，看这一篇文章就够了（部分项目附源码）HAPHAP（HarmonyAbilityPackage）是应用安装和运行的基本单元。HAP包是由代码、资源、第三方库、配置文件等打包生成的
  • nvm 安装某个node.js版本后不能使用或者报错，或不能使用npm的问题 腥臭腐朽的日子熠熠生辉 node.jsnpm前端
    安装了nvm之后发现不能使用某个版本的node.js，报错之后，不能使用npm这个命令。可以这样解决：1、再node.js官网直接下载node.js的压缩包。找到nvm的安装目录2、直接将文件夹解压到这个安装目录中修改一下名字即可。
  • flutter 使用xcodebuild 命令打包ipa 肥肥呀呀呀 flutter
    苹果打ipa包(注意苹果打包需要连接真机)方式一、1.先执行flutterbuildios生成framework2.执行命令xcodebuild-exportArchive-archivePathbuild/ios/Runner.xcarchive-exportOptionsPlistexportOptions.plist-exportPathbuild/ios/ipaexportOptions.
  • Flutter中常用命令 肥肥呀呀呀 flutter经验flutter
    1.检测flutter运行环境flutterdoctor2.升级flutterflutterupgrade3.查看flutter版本flutter--version4.查看连接的设备flutterdevices5.运行flutter项目flutterrun或者在vscode中按Fn+F56.打包flutterbuildapk//默认打release包7.开启web端构建(开启以后每次新建flutt
  • 【Flutter】从安卓与iOS包体优化到一键自动打包脚本的一条龙服务 sugood Flutterandroidflutterios
    系统信息Systemversion:MacOS12Flutterversion:1.22.5Dartversion:2.10.4AndroidStudioversion:4.1.1介绍APK优化包体大小APK多渠道打包APK一键打包脚本IPA优化包体大小IPA无签名打包IPA一键打包脚本脚本地址github脚本地址安卓APK优化包体大小优化图片等资源大小，删除无用资源只选择保留必要的so库。第三方
  • 纯血鸿蒙系统 HarmonyOS NEXT自动化测试实践 夜阑卧听风吹雨，铁马冰河入梦来 pythonAppium自动化测试harmonyos华为
    1、测试框架选择hdc：类似android系统的adb命令，提供设备信息查询，包管理，调试相关的命令@ohos.UiTest：鸿蒙sdk的一部分，类似androidsdk里的uiautomator，基于Accessibility服务，提供模拟UI操作的能力。但是需要用arkTS语言来写自动化case，并且用例需要打包到被测app里面hypium：鸿蒙官方的自动化框架，功能比较完善，可以基于pyth
  • webpack初识（js逆向） shix . js逆向知识点webpackjavascript前端
    webpack调试很多时候再看webpack的代码块的时候都一头雾水，不知道这个函数的具体逻辑在哪里，因为打包之后一些函数块是通过数字或者字符串进行调用的就像这样这里每个括号包括着的字符串都相当于一个函数，但是他们的逻辑在其他地方第二种情况：window["webpackJsonp"]大概长这样(=window["webpackJsonp"]||[]).push(["login"])作用就是把打包
  • 图片压缩及水印添加概述华为云微认证 大嘴巴子 华为网络技术华为华为云网络
    一、图片压缩和水印添加概述（1）为更好地传输，存储和辨识数据；使用压缩降低图片大小，节约了成本；图片压缩：简单易用；；图片压缩软件：功能单一；网页在线图片压缩；自设图片压缩代码：需要变成基础；使用云服务批量压缩：适合批量处理，可结合自设代码；（2）水印：logo增加辨识，盖章表示版权；附加信息，可增加了地点等信息；二、函数工作流简介（1）是华为云提供的一款无服务器计算服务，它包含了函数和工作流两个
  • 设计模式介绍 tntxia 设计模式
    设计模式来源于土木工程师 克里斯托弗 亚历山大（http://en.wikipedia.org/wiki/Christopher_Alexander）的早期作品。他经常发表一些作品，内容是总结他在解决设计问题方面的经验，以及这些知识与城市和建筑模式之间有何关联。有一天，亚历山大突然发现，重复使用这些模式可以让某些设计构造取得我们期望的最佳效果。 亚历山大与萨拉-石川佳纯和穆雷 西乐弗斯坦合作
  • android高级组件使用(一) 百合不是茶 androidRatingBarSpinner
    1、自动完成文本框（AutoCompleteTextView） AutoCompleteTextView从EditText派生出来，实际上也是一个文本编辑框，但它比普通编辑框多一个功能：当用户输入一个字符后，自动完成文本框会显示一个下拉菜单，供用户从中选择，当用户选择某个菜单项之后，AutoCompleteTextView按用户选择自动填写该文本框。 使用AutoCompleteTex
  • [网络与通讯]路由器市场大有潜力可挖掘 comsci 网络
              如果国内的电子厂商和计算机设备厂商觉得手机市场已经有点饱和了,那么可以考虑一下交换机和路由器市场的进入问题.....        这方面的技术和知识,目前处在一个开放型的状态,有利于各类小型电子企业进入  &nbs
  • 自写简单Redis内存统计shell 商人shang Linux shell统计Redis内存
    #!/bin/bash address="192.168.150.128:6666,192.168.150.128:6666" hosts=(${address//,/ }) sfile="staticts.log" for hostitem in ${hosts[@]} do ipport=(${hostitem
  • 单例模式(饿汉 vs懒汉) oloz 单例模式
    package 单例模式; /* * 应用场景:保证在整个应用之中某个对象的实例只有一个 * 单例模式种的《 懒汉模式》 * */ public class Singleton { //01 将构造方法私有化，外界就无法用new Singleton()的方式获得实例 private Singleton(){}; //02 申明类得唯一实例 priva
  • springMvc json支持 杨白白 json springmvc
    1.Spring mvc处理json需要使用jackson的类库，因此需要先引入jackson包 2在spring mvc中解析输入为json格式的数据:使用@RequestBody来设置输入 @RequestMapping("helloJson") public @ResponseBody JsonTest helloJson() {
  • android播放，掃描添加本地音頻文件 小桔子
            最近幾乎沒有什麽事情，繼續鼓搗我的小東西。想在項目中加入一個簡易的音樂播放器功能，就像華為p6桌面上那麼大小的音樂播放器。用過天天動聽或者QQ音樂播放器的人都知道，可已通過本地掃描添加歌曲。不知道他們是怎麼實現的，我覺得應該掃描設備上的所有文件，過濾出音頻文件，每個文件實例化為一個實體，記錄文件名、路徑、歌手、類型、大小等信息。具體算法思想，
  • oracle常用命令 aichenglong oracledba常用命令
    1 创建临时表空间 create temporary tablespace user_temp  tempfile 'D:\oracle\oradata\Oracle9i\user_temp.dbf' size 50m  autoextend on  next 50m maxsize 20480m  extent management local
  • 25个Eclipse插件 AILIKES eclipse插件
    提高代码质量的插件1. FindBugsFindBugs可以帮你找到Java代码中的bug，它使用Lesser GNU Public License的自由软件许可。2. CheckstyleCheckstyle插件可以集成到Eclipse IDE中去，能确保Java代码遵循标准代码样式。3. ECLemmaECLemma是一款拥有Eclipse Public License许可的免费工具，它提供了
  • Spring MVC拦截器+注解方式实现防止表单重复提交 baalwolf spring mvc
    原理：在新建页面中Session保存token随机码，当保存时验证，通过后删除，当再次点击保存时由于服务器端的Session中已经不存在了，所有无法验证通过。   1.新建注解：   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
  • 《Javascript高级程序设计(第3版)》闭包理解 bijian1013 JavaScript
    “闭包是指有权访问另一个函数作用域中的变量的函数。”--《Javascript高级程序设计(第3版)》         看以下代码： <script type="text/javascript"> function outer() { var i = 10; return f
  • AngularJS Module类的方法 bijian1013 JavaScriptAngularJSModule
            AngularJS中的Module类负责定义应用如何启动，它还可以通过声明的方式定义应用中的各个片段。我们来看看它是如何实现这些功能的。 一.Main方法在哪里         如果你是从Java或者Python编程语言转过来的，那么你可能很想知道AngularJS里面的main方法在哪里？这个把所
  • [Maven学习笔记七]Maven插件和目标 bit1129 maven插件
    插件(plugin)和目标(goal) Maven，就其本质而言，是一个插件执行框架，Maven的每个目标的执行逻辑都是由插件来完成的，一个插件可以有1个或者几个目标，比如maven-compiler-plugin插件包含compile和testCompile，即maven-compiler-plugin提供了源代码编译和测试源代码编译的两个目标   使用插件和目标使得我们可以干预
  • 【Hadoop八】Yarn的资源调度策略 bit1129 hadoop
    1. Hadoop的三种调度策略 Hadoop提供了3中作业调用的策略， FIFO Scheduler Fair Scheduler Capacity Scheduler 以上三种调度算法，在Hadoop MR1中就引入了，在Yarn中对它们进行了改进和完善.Fair和Capacity Scheduler用于多用户共享的资源调度   2. 多用户资源共享的调度
  • Nginx使用Linux内存加速静态文件访问 ronin47
    Nginx是一个非常出色的静态资源web服务器。如果你嫌它还不够快，可以把放在磁盘中的文件，映射到内存中，减少高并发下的磁盘IO。 先做几个假设。nginx.conf中所配置站点的路径是/home/wwwroot/res，站点所对应文件原始存储路径：/opt/web/res shell脚本非常简单，思路就是拷贝资源文件到内存中，然后在把网站的静态文件链接指向到内存中即可。具体如下：
  • 关于Unity3D中的Shader的知识 brotherlamp unityunity资料unity教程unity视频unity自学
    首先先解释下Unity3D的Shader，Unity里面的Shaders是使用一种叫ShaderLab的语言编写的，它同微软的FX文件或者NVIDIA的CgFX有些类似。传统意义上的vertex shader和pixel shader还是使用标准的Cg/HLSL 编程语言编写的。因此Unity文档里面的Shader，都是指用ShaderLab编写的代码，然后我们来看下Unity3D自带的60多个S
  • CopyOnWriteArrayList vs ArrayList bylijinnan java
    package com.ljn.base; import java.util.ArrayList; import java.util.Iterator; import java.util.List; import java.util.concurrent.CopyOnWriteArrayList; /** * 总述： * 1.ArrayListi不是线程安全的，CopyO
  • 内存中栈和堆的区别 chicony 内存
    1、内存分配方面：     堆：一般由程序员分配释放， 若程序员不释放，程序结束时可能由OS回收 。注意它与数据结构中的堆是两回事，分配方式是类似于链表。可能用到的关键字如下：new、malloc、delete、free等等。     栈：由编译器(Compiler)自动分配释放，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中
  • 回答一位网友对Scala的提问 chenchao051 scalamap
    本来准备在私信里直接回复了，但是发现不太方便，就简要回答在这里。 问题 写道 对于scala的简洁十分佩服，但又觉得比较晦涩，例如一例，Map("a" -> List(11,111)).flatMap(_._2)，可否说下最后那个函数做了什么，真正在开发的时候也会如此简洁？谢谢    先回答一点，在实际使用中，Scala毫无疑问就是这么简单。
  • mysql 取每组前几条记录 daizj mysql分组最大值最小值每组三条记录
    一、对分组的记录取前N条记录：例如：取每组的前3条最大的记录 1.用子查询： SELECT * FROM tableName a  WHERE 3> (SELECT COUNT(*) FROM  tableName b WHERE b.id=a.id AND b.cnt>a. cnt) ORDER BY a.id,a.account DE
  • HTTP深入浅出 http请求 dcj3sjt126com http
      HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则。计算机专家设计出HTTP，使HTTP客户（如Web浏览器）能够从HTTP服务器(Web服务器)请求信息和服务，HTTP目前协议的版本是1.1.HTTP是一种无状态的协议，无状态是指Web浏览器和Web服务器之间不需要建立持久的连接，这意味着当一个客户端向服务器端发出请求，然后We
  • 判断MySQL记录是否存在方法比较 dcj3sjt126com mysql
    把数据写入到数据库的时，常常会碰到先要检测要插入的记录是否存在，然后决定是否要写入。 　　我这里总结了判断记录是否存在的常用方法： 　　sql语句： select   count ( * )  from  tablename; 　　然后读取count(*)的值判断记录是否存在。对于这种方法性能上有些浪费，我们只是想判断记录记录是否存在，没有必要全部都查出来。
  • 对HTML XML的一点认识 e200702084 htmlxml
    感谢http://www.w3school.com.cn提供的资料 HTML 文档中的每个成分都是一个节点。 节点 根据 DOM，HTML 文档中的每个成分都是一个节点。 DOM 是这样规定的： 整个文档是一个文档节点 每个 HTML 标签是一个元素节点 包含在 HTML 元素中的文本是文本节点 每一个 HTML 属性是一个属性节点 注释属于注释节点 Node 层次
  • jquery分页插件 genaiwei jqueryWeb前端分页插件
    //jquery页码控件// 创建一个闭包    (function($) {      // 插件的定义      $.fn.pageTool = function(options) {        var totalPa
  • Mybatis与Ibatis对照入门于学习 Josh_Persistence mybatisibatis区别联系
    一、为什么使用IBatis/Mybatis         对于从事 Java EE 的开发人员来说，iBatis 是一个再熟悉不过的持久层框架了，在 Hibernate、JPA 这样的一站式对象 / 关系映射（O/R Mapping）解决方案盛行之前，iBaits 基本是持久层框架的不二选择。即使在持久层框架层出不穷的今天，iBatis 凭借着易学易用、
  • C中怎样合理决定使用那种整数类型？ 秋风扫落叶 c数据类型
    如果需要大数值(大于32767或小于32767), 使用long 型。 否则, 如果空间很重要 (如有大数组或很多结构), 使用 short 型。 除此之外, 就使用 int 型。 如果严格定义的溢出特征很重要而负值无关紧要, 或者你希望在操作二进制位和字节时避免符号扩展的问题, 请使用对应的无符号类型。 但是, 要注意在表达式中混用有符号和无符号值的情况。    &nbs
  • maven问题 zhb8015 maven问题
      问题1： Eclipse 中 新建maven项目 无法添加src/main/java 问题    eclipse创建maevn web项目，在选择maven_archetype_web原型后，默认只有src/main/resources这个Source Floder。     按照maven目录结构，添加src/main/ja
  • (二)androidpn-server tomcat版源码解析之--push消息处理 spjich javaandrodipn推送
    在 (一)androidpn-server tomcat版源码解析之--项目启动这篇中，已经描述了整个推送服务器的启动过程，并且把握到了消息的入口即XmppIoHandler这个类，今天我将继续往下分析下面的核心代码，主要分为3大块，链接创建，消息的发送，链接关闭。 先贴一段XmppIoHandler的部分代码 /** * Invoked from an I/O proc
  • 用js中的formData类型解决ajax提交表单时文件不能被serialize方法序列化的问题 中华好儿孙 JavaScriptAjaxWeb上传文件FormData
    var formData = new FormData($("#inputFileForm")[0]); $.ajax({ type:'post', url:webRoot+"/electronicContractUrl/webapp/uploadfile", data:formData, async: false, ca
  • mybatis常用jdbcType数据类型 ysj5125094 mybatismapperjdbcType
      MyBatis 通过包含的jdbcType 类型 BIT         FLOAT      CHAR