筱淑
筱淑

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,打包压缩)

  • git - Webhook让部署自动化 大猪大猪
    我们现在有一个需求，将项目打包上传到gitlab或者github后，程序能自动部署，不用手动地去服务器中进行项目更新并运行，如何做到？这里我们可以使用gitlab与github的挂钩，挂钩的原理就是，每当我们有请求到gitlab与github服务器时，这时他俩会根据我们配置的挂钩地扯进行访问，webhook挂钩程序会一直监听着某个端口请求，一但收到他们发过来的请求，这时就知道用户有请求提交了，这时
  • webpack图片等资源的处理 dmengmeng
    需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
  • Redis系列：Geo 类型赋能亿级地图位置计算 Ly768768 redisbootstrap数据库
    1前言我们在篇深刻理解高性能Redis的本质的时候就介绍过Redis的几种基本数据结构，它是基于不同业务场景而设计的：动态字符串(REDIS_STRING)：整数(REDIS_ENCODING_INT)、字符串(REDIS_ENCODING_RAW)双端列表(REDIS_ENCODING_LINKEDLIST)压缩列表(REDIS_ENCODING_ZIPLIST)跳跃表(REDIS_ENCODI
  • 2023-07-24 DXZHY
    很2023年7月24号星期天，今天呢一早我就去开店，淋完花我就赶去了中心联谊，感谢中心联谊过程当中，他们在唱诵读者上面1.一边流泪，感觉自己的内在灵魂太长，时间没有得到这样了，所以一边唱手一边在流泪，我分不清楚自己是感动了，还是被呼唤的灵魂所能看到，但我就是哭了，泪流满面，我全身细胞在放松，最后我们荣耀完了之后，我打包了一部分回来，我发现我是挺真爱想摸的，然而。那我们商量好之后，他要做出一些违背我
  • 2024.9.14 Python，差分法解决区间加法，消除游戏，压缩字符串 RaidenQ python游戏开发语言算法力扣
    1.区间加法假设你有一个长度为n的数组，初始情况下所有的数字均为0，你将会被给出k个更新的操作。其中，每个操作会被表示为一个三元组：[startIndex,endIndex,inc]，你需要将子数组A[startIndex…endIndex]（包括startIndex和endIndex）增加inc。请你返回k次操作后的数组。示例:输入:length=5,updates=[[1,3,2],[2,4,
  • python批量读取tiff文件_Python Pillow批量转换tif格式到jpg weixin_39557797
    最近因为想要整下网站的壁纸，从网站下载了别人整理好的合集压缩包，解压之后，却发现里面的文件都是tif的，tif格式网站和电脑都不认的，根本不能作壁纸。这时候，就需要转换图片格式了，首先我找了几款转换格式的软件，发现效果都不好，要不是不支持tif格式，要不就是转换出来的图片糊的不行。最终，还是决定用Python的Pillow库来写一个脚本，完成这个任务。下面是整个的小脚本----importosim
  • 利用python实现图片格式之间的相互转换 难得北窗高卧 python开发语言
    一、概要图片一般有多种格式，常见的图片格式包括：JPEG（.jpg或.jpeg）：一种广泛使用的有损压缩格式，适用于摄影图像和网页上的图片。PNG（.png）：一种无损压缩格式，支持透明度和更好的图像质量，常用于图标、图形和需要透明背景的图片。该图片是4通道的，外加一个透明通道。如截屏GIF（.gif）：一种支持动画和透明度的格式，常用于简单的动画和图标。BMP（.bmp）：一种无损格式，存储图像
  • Python程序打包指南：手把手教你一步步完成 Python_P叔 python数据库开发语言
    最近感兴趣想将开发的项目转成Package，研究了一下相关文章，并且自己跑通了，走了一下弯路，这里记录一下如何打包一个简单的Python项目，展示如何添加必要的文件和结构来创建包，如何构建包，以及如何将其上传到Python包索引（PyPI）。首先要确保安装最新版本：#Unix/macOSpython3-mpipinstall--upgradepip#windowspy-mpipinstall--u
  • maven-assembly-plugin 打包实例 带着二娃去遛弯
    1.先在pom.xml文件中添加assembly打包插件org.apache.maven.pluginsmaven-assembly-plugin2.6assembly/assembly.xmlmake-assemblypackagesingle说明:1.需要修改的可能就是descriptors标签下面的打包配置文件目录,指定assembly.xml的路径.2.可以添加多个打包配置文件,进行多种形
  • 体适能NO.2 leeson许一
    与其过几年或几十年地狱一般的日子慢慢变弱、生病，痛苦的拖延油尽灯枯的过程，我们不如把死亡压缩为生命中一个短暂的片段。与其慢慢萎缩成一团恶心的肥肉，我们的离开骑士可以像是大重量深蹲最后一组最后失败的那一次。在背迅速压垮离开这个世界之前，我们可以强大而富有生机的姿势迎接最后的时光。保持强壮，直到生命的最后一刻”——这段话摘自《力量训练计划》，与大家共勉。天生为运动而生，为什么你选择遗忘运动？心率心率指
  • python转换为可执行文件的方法有哪些 嗷呜大嘴狼 python开发语言git
    转换为可执行文件的方法有哪些在Python编程中，我们通常会遇到需要将代码转换为可执行文件的场景，以便在其他计算机上运行代码。那么，Python中转换为可执行文件的方法有哪些呢？本文将从三个方面介绍。转换为可执行文件的方法有哪些一、使用pyinstallerPyinstaller是一个流行的Python打包工具，可以将Python代码打包为可执行文件。使用pyinstaller的步骤如下：1、安装
  • WORD批量转换器MultiDoc Converter uolian 工作word
    WORD批量转换器MultiDocConverterhttps://www.52pojie.cn/thread-1318745-1-1.html可批量将doc、docx等文件格式转成doc、docx、pdf、rtf、txt、html、epub等格式。安装包下载地址：https://wws.lanzouj.com/irvVbiz0pkd最终下载文件打包地址（未作成单文件，不确定是否可以直接使用）：h
  • Python(PyTorch)和MATLAB及Rust和C++结构相似度指数测量导图 亚图跨际 Python交叉知识算法量化检查图像压缩质量低分辨率多光谱峰值信噪比端到端优化图像压缩手术机器人三维实景实时可微分渲染重建三维可视化
    要点量化检查图像压缩质量低分辨率多光谱和高分辨率图像实现超分辨率分析图像质量图像索引/多尺度结构相似度指数和光谱角映射器及视觉信息保真度多种指标峰值信噪比和结构相似度指数测量结构相似性图像分类PNG和JPEG图像相似性近似算法图像压缩，视频压缩、端到端优化图像压缩、神经图像压缩、GPU变速图像压缩手术机器人深度估计算法重建三维可视化推理图像超分辨率算法模型三维实景实时可微分渲染算法MATLAB结构
  • 真传一句话，假传万卷经 覃榜言
    真传一句话，假传万卷经。这句话说的是大道至简。传说古时候，有一个中东地区的王，让他的大臣们编写一本书，以教化他的子民。过了很长一段时间，他的大臣们呈上了一本很厚的书。王说，能不能压缩一点。又过一段时间，他的大臣们呈上了一本薄了很多的书，王又说，还是太厚。他的大臣们只好再删减，终于写成了一本很薄的小册子。但王还是不是满意。大臣们这下可为难了，只好群策群力，绞尽脑汁，写下了一句话。写好了给王看。王很满
  • shp文件解析转换为geojson/wkt格式字符串 自律_平庸 前端数据库大数据
    此函数用于处理上传的ZIP文件并将其转换为GeoJSON格式的字符串。具体步骤如下：验证上传文件是否为ZIP格式。创建临时目录以解压ZIP文件。解压缩ZIP文件至临时目录。查找解压后的.shp文件。如果缺少.shx或.dbf辅助文件，则创建空文件。读取Shapefile数据。将特征集合转换为GeoJSON格式。清理临时文件和资源。函数返回转换后的GeoJSON字符串。publicStringshp
  • Linux命令行基础——软件包管理 HHwxtx linux运维服务器
    1.软件包管理的发展初始阶段最早的软件包管理可以追溯到Unix系统的早期版本。在那时，软件通常以源代码的形式分发，并由系统管理员手动编译和安装。这种方式的管理比较原始和繁琐，因为每次安装都需要手动解决依赖关系和编译问题。软件包的引入为了简化安装过程，软件包被引入Linux，它将软件及其所有文件和资源打包在一起的集合，通常包括可执行文件、库文件、配置文件、文档和元数据（如软件名称、版本号、依赖关系等
  • linux的安装程序 与 文件 相关的命令 可能只会写BUG c语言c/c++linuxlinux服务器运维
    软件安装卸载命令软件包介绍软件包命名格式dpkg命令apt-get命令apt-get命令压缩和解压命令压缩文件后缀压缩命令打包和解包命令tar命令文件分割命令split命令文件操作相关命令cat命令head命令tail命令more命令less命令管道命令wc命令grep命令find命令cut命令sort命令uniq命令diff命令文件属性命令chmod命令chown命令chgrp命令ln命令硬链接
  • Conda的清理（一下少了14G） Pin_BOY 配置TSC服务器linusanaconda
    一般使用conda命令清理condaclean-p//删除没有用的包（推荐）condaclean-t//tar打包condaclean-y-all//删除全部的安装包及cache如果想看看到底占多大存储空间可以往下看进入Anconda目录，通过命令du-sh*查看当下目录的所占内存为什么pkgs这么大！查阅资料后发现Anaconda文件夹下有个pkgs文件夹。据我观测（没找到正式说明），里面是各种
  • Linux常用文件压缩/解压命令格式大全（tar、gzip、bzip2、zip、compress、cpio、compress、dd）建议收藏 狱典司 Linux网络服务linux操作系统shell
    Linux常用文件压缩/解压命令格式大全1.tar2.gzip3.bzip24.zip5.compress6.cpio7.dd1.tar打包备份后的文件包缀：.tar作用：用来对系统上的文件作备份与恢复，可以将系统上多个文件组构成一个tar文件备份到磁盘内或写入到一般的文件（文件名为*.tar）上，也可以将文件从一个tar文件解回到原来的系统中。说明：仅能将一个目录下的所有文件变成一个文件，不具备
  • P3489 [POI2009] WIE-Hexer summ1ts 算法c++图论dijkstra状态压缩
    *原题链接*最短路+状态压缩不愧是POI的题，看题面知道要求加了一些限制的最短路，看数据范围很容易想到状态压缩。求解最短路就用堆优化dijkstra好了。至于状态压缩，我们对原数组再开一维，表示此时“剑的集合”，相应的数组也要多开一维。由于此时的最短路有状态的限制，所以我们要用三元组来维护，如果不想写结构体也可以pair,int>。输入时存储边上的“怪物集合”，以及一个村庄的“铁匠集合”，在来到新
  • Win11安装mysql5.7.24  嘘  MYSQLmysql
    Win11安装mysql5.7.24资源文件mysql安装过程资源文件mysql5.7.24免安装压缩包下载链接：https://download.csdn.net/download/weixin_44174685/89738053DirectX（用来修复缺失dll）下载链接：https://download.csdn.net/download/weixin_44174685/89737971my
  • linux 操作系统下的compress命令介绍和使用案例 lisanmengmeng linux命令工具linux运维服务器
    linux操作系统下的compress命令介绍和使用案例compress命令是Linux系统中用于文件压缩的一个工具，主要使用Lempel-Ziv-Welch(LZW)算法进行数据压缩。压缩后，文件的扩展名将变为“.Z”。虽然compress命令在历史上有其重要性，但在现代Linux系统中，它已经被更高效的压缩工具如gzip和bzip2所取代使用方法基本语法bashcompress[选项][文件名
  • ⭐Unity 安卓环境中正确地读取和处理 XML 文件 惊鸿醉 Unityunityandroidxml
    写了一个选择题Demo，电脑包和编辑器内无问题，但是打包安卓手机之后题目无法正常使用，想到的是安卓环境中正确地读取文件的问题改进方案：1.由于XmlDocument.Load方法在Android上的路径问题（由于文件位于APK内部，无法像在文件系统中那样直接访问），需要先使用UnityWebRequest来异步加载文件内容，然后再解析XML。2.异步处理：修改你的代码，以支持异步文件加载和处理，这
  • 欺诈文本分类检测（十四）：GPTQ量化模型 沉下心来学鲁班 微调分类人工智能语言模型微调
    1.引言量化的本质：通过将模型参数从高精度（例如32位）降低到低精度（例如8位），来缩小模型体积。本文将采用一种训练后量化方法GPTQ，对前文已经训练并合并过的模型文件进行量化，通过比较模型量化前后的评测指标，来测试量化对模型性能的影响。GPTQ的核心思想在于：将所有权重压缩到8位或4位量化中，通过最小化与原始权重的均方误差来实现。在推理过程中，它将动态地将权重解量化为float16，以提高性能，
  • python打包whl文件 梦中学逆向 pythonpython
    简介当我们自己开发完一个项目时，如果想在别的电脑上使用，将所有文件复制比较麻烦，这时将所有项目打包成一个whl文件，再到别的电脑安装就很简单了准备一个新的虚拟环境：避免版本冲突安装wheel，后面打包要用pipinstallwheel将所有项目放在同一个文件夹下，新建一个setup.py文件importosimportreimportsysfromsetuptoolsimportsetupimpo
  • python工程打包成whl文件 机灵巢穴_WitNest pythonpython开发语言
    资料：PackagingPythonProjects—PythonPackagingUserGuide6.Modules—Python3.11.4documentation步骤1.安装打包工具python3-mpipinstallsetuptoolswheeltwine2.更新pip工具python3-mpipinstall--upgradepip3.创建工程结构python_test_packa
  • 数据压缩（1）——简介 永恒星 计算机基础数据压缩信息熵
    【前言】数据压缩存在于计算机、网络的各个地方，是很底层的技术支持，例如歌曲、图像、视频、网页、文本等的保存和传输都是用过数据压缩算法的。总的来说，我们常使用数据压缩来增多硬盘存储的内容、减少网络传输的流量。数据压缩研究的是，在可接受的信息恢复程度下，可以将信息变得有多紧凑。通常有两个思路：减少数据中不同符号的数据量；用更少的位数对更常见的符号进行编码。数据压缩的算法多种多样，没有万能的算法，通用算
  • 工业数据采集网关的作用-天拓四方 北京天拓四方 边缘计算物联网iot
    工业数据采集网关是一种专门用于采集、处理、传输工业现场数据的设备。它能够实时收集来自各种传感器、仪表和设备的数据，并通过网络将这些数据传输到云端或数据中心。同时，数据采集网关还具备数据清洗、转换和压缩等功能，确保数据的质量和传输效率。随着工业4.0时代的来临，数字化转型已成为工业发展的必然趋势。工业数据采集网关作为连接物理世界与数字世界的桥梁，其在工业数字化转型中发挥着至关重要的作用。本文将详细探
  • docker镜像的批量备份和加载 小卡车555 docker
    随着微服务的不断发展，docker在微服务的部署中也占着不可缺少的角色，有这样一种场景，需要将服务器上的若干个最新的镜像打成tar.gz做一个备份或者异地部署。针对此问题尝试写了如下shell脚本#vimsaveImages.sh脚本内容如下：#当前需要打包的版本号version=xxx.0.0.1-RELEASE#仓库rep=defaultRep#名称name=defaultNameforiin
  • 读“实行十年义务教育建议”笔记（二） 爬坡启动
    这几天读到公众号“教研报”的一篇文章，主题是人大代表建议实行十年义务教育，即把现在的高中读完12年压缩成十年。昨天主要说了把小学六年压缩为五年，现行高中3年压缩为2年，初中三年不变，共十年，也即实质上实行了十年义务教育！今天接着说这件事。建议缩短学制、取消中考、普及高中，把上小学年龄推迟到7岁。“走出教育‘内卷’必须从教育制度改革上入手，普及高中是必由之路。”甘华田今年两会上说，在具体的制度设计上
  • 设计模式介绍 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