gulp - 缩小 CSS 时排除文件

2024-02-12

我是 Gulp 新手..我已经能够成功安装、连接和缩小我的 .js 和 .css 文件,但是,有一个我想排除的 .css 文件 - print.css

我已按照此处的说明进行操作:https://www.npmjs.org/package/gulp-ignore https://www.npmjs.org/package/gulp-ignore在我的本地目录中安装 gulp-ignore,并将 gulpfile.js 修改为:

// Include gulp
var gulp = require('gulp'); 

// Include Our Plugins
var jshint = require('gulp-jshint');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var minifyCSS = require('gulp-minify-css');
var imagemin = require('gulp-imagemin');
var exclude = require('gulp-ignore').exclude;


var paths = {
  scriptsNonAuth: ['Non-Auth/javascript/*.js'],
  scriptsAuth: ['Auth/javascript/*.js'],
  stylesNonAuth: ['Non-Auth/css/*.css'],
  stylesAuth: ['Auth/css/*.css'],
};

// CSS Task - Non Authenticated
gulp.task('minify-css-non-auth', function() {
  gulp.src(paths.stylesNonAuth)
    .pipe(minifyCSS(opts))
    .pipe(concat('all.min.css'))
    .pipe(gulp.dest('Non-Auth/css'))
});

// CSS Task - Authenticated
gulp.task('minify-css-auth', function() {
  gulp.src(paths.stylesAuth)
    .pipe(minifyCSS(opts))
    **.pipe(exclude('Auth/css/print.css'))**
    .pipe(concat('all.min.css'))
    .pipe(gulp.dest('Auth/css'))
});

在我的 CSS 任务 - Secure 中,我包含了 .pipe(exclude('Secure/css/print.css'))

当我运行 gulp minify-css-secure 时,任务完成,但在检查新的 all.min.css 时,我也看不到其中 print.css 的内容。


目前尚不清楚您想要实现什么目标。如果我猜对了,你想要:

  1. 缩小所有 css 文件(包括 print.css)
  2. 将除 print.css 之外的所有文件合并到 all.min.css 中
  3. 将缩小后的 all.min.css 和 print.css 放入目标文件夹

为了实现这一点,您可以使用流队列 https://github.com/nfroidure/StreamQueue. (source https://github.com/gulpjs/gulp/blob/master/docs/recipes/using-multiple-sources-in-one-task.md)

var streamqueue = require('streamqueue');

var paths = {
  scriptsNonAuth: ['Non-Auth/javascript/*.js'],
  scriptsAuth: ['Auth/javascript/*.js'],
  stylesNonAuth: ['Non-Auth/css/*.css'],
  stylesAuth: ['Auth/css/*.css', '!Auth/css/print.css'],
};

gulp.task('minify-css-auth', function() {
  return streamqueue({ objectMode: true },
    gulp.src(paths.stylesAuth)
        .pipe(minifyCSS(opts))
        .pipe(concat('all.min.css')),
    gulp.src('Auth/css/print.css'))
        .pipe(minifyCSS(opts))
  )
   .pipe(gulp.dest('Auth/css'))
});

如果您只想排除某些文件,则不需要 gulp-ignore。 Gulp 支持忽略 glob。 只需在要排除的路径前添加 bang 即可。
像这样:

stylesAuth: ['Auth/css/*.css', '!Auth/css/print.css']
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

gulp - 缩小 CSS 时排除文件 的相关文章

  • 在其他不可滚动的 div 上滚动时如何滚动可滚动的 div?

    我知道这个问题听起来很令人困惑 但这就是我想要做的 在下面的代码片段中 如果用户在绿色 div 上滚动 我希望黄色 div 相应地滚动 就像滚动黄色 div 一样 请注意 黄色 div 有overflow auto 但绿色的则不然 docu
  • React Native:不透明视图内的透明视图

    我想用不透明框架和透明中心显示相机的视图 就像图片中的一样 黑色部分是相机的视图 我正在寻找具有纯反应本机组件的解决方案 没有额外的库 例如https github com gilbox react native masked view h
  • JavaScript - 无需布尔值即可运行一次

    有没有办法只运行一段JavaScript代码ONCE 而不使用布尔标志变量来记住它是否已经运行过 具体来说not就像是 var alreadyRan false function runOnce if alreadyRan return a
  • Swift 3 中是否提供内置内部函数?

    我可以在 Xcode 自动完成弹出窗口中看到各种内置函数 如 builtin popount builtin clz 等 我不确定这些是从哪里获取的 单击命令不会导致快速定义或任何文档 Swift 3 中是否有 builtin 或等效的内部
  • 如何强制折断不可折断的字符串?

    我有一个根据数据库中包含的数据生成的 HTML 页面 数据库有时包含浏览器无法分解的长字符串 因为这些字符串不包含可分解的字符 空格 点 逗号等 有没有办法使用 html css 甚至 javascript 来解决这个问题 看到这个link
  • 如何在php中使用一张图像绘制形状

    我需要使用图像的一部分来创建帧图像 例如 用户将从后端上传图像片段 现在我需要根据前端用户的要求在前端创建一个框架 用户将选择框架的高度和宽度 然后他将选择该图像片段 如下所示 我没有办法做到这一点 我尝试通过 css 和 html can
  • 限制 Dropzone 仅上传特定类型的文件

    我正在使用 Dropzone 上传文件 这是我的代码 div div
  • 使用 :hover 作为元素的内联样式(使用 HTML/CSS/php)[重复]

    这个问题在这里已经有答案了 可能的重复 如何将 a hover 规则嵌入到文档中间的样式属性中 https stackoverflow com questions 131653 how do i embed an ahover rule i
  • 避免在 ES6 的函数内定位 this 的对象作用域

    例如 我正在使用 D3 js 运行一个项目 导入特定模块并调用它们的函数 Setup TypeScript ES6 导入特定的 D3 组件 角6 我有一个对象 在本例中是一个角度指令 并在 SVG 画布上绘制一些圆圈 并希望它们在拖动事件上
  • 窗口大小调整触发的 DOM 事件

    我有一个布局相当复杂的页面 最初打开页面时 某些元素的对齐存在问题 但是 可以通过更改浏览器窗口的大小来 永久 解决此问题 显然 我不希望用户必须调整浏览器窗口的大小才能使页面正确显示 所以我想知道是否有一种方法可以在页面首次加载时以编程方
  • 带有 mkdocs 的本地 mathjax

    我想在无法访问互联网的计算机上使用 MathJax 和 Mkdocs 因此我不能只调用 Mathjax CDN Config mkdocs yml site name My Docs extra javascript javascripts
  • 如何知道浏览器空闲时间?

    如何跟踪浏览器空闲时间 我用的是IE8 我没有使用任何会话管理 也不想在服务器端处理它 这是纯 JavaScript 方法来跟踪空闲时间 并在达到一定限制时执行一些操作 var IDLE TIMEOUT 60 seconds var idl
  • 将 onclick 事件应用于页面加载时不存在的元素

    我将列表样式设置为看起来像选择框 并且当用户单击列表中的元素时我想触发一个函数 但是该元素是通过加载的AJAX因此 当页面加载并且我无法绑定时不存在onclick事件到它onDomReady 如果我把它作为一个普通的选择列表 我可以只标记一
  • @aspnet/signalr 与 @microsoft/signalr javascript 库

    aspnet signalr 与 microsoft signalr javascript 库有什么区别 两者似乎都对 DotNetCore SignalR 有效 两者似乎都很活跃 在一些教程中 我找到 aspnet signalr 在Do
  • jQuery 悬停时滚动到 div 并返回到第一个元素

    我基本上有一个具有设定尺寸的 div 和overflow hidden 该 div 包含 7 个子 div 但一次只显示一个 我希望当它们各自的链接悬停时能够平滑地垂直滚动 但是 第一部分 div 没有链接 并且是没有悬停链接时的默认部分
  • 根据特定字符获取整个字符串或子字符串

    我有一个包含 MIME 类型的字符串 例如application json 现在我想将其与实际的 HTTP 标头进行比较 在本例中content type 如果标头包含 MIME 类型 那么就很简单 if mimeType contentT
  • 如何:带有 onclick 的 div 位于另一个带有 onclick 的 div 中

    只是一个简单的问题 我遇到了 div 与 onclick javascript 之间的问题 当我点击内部 div 时 它应该只触发它的 onclick javascript 但外部 div 的 javascript 也会被触发 用户如何点击
  • AngularJS 在指令运行之前通过 AJAX 检索数据

    我正在使用 AngularUIuiMap http angular ui github com directives map实例化谷歌地图的指令 uiMap 指令非常适合处理硬编码数据 mapOptions and myMarkers 但是
  • 搜索多维数组 JavaScript

    我有一个如下所示的数组 selected products 0 r1 7up 61 Albertsons selected products 1 r3 Arrowhead 78 Arrowhead selected products 2 r
  • DOM 解析器 Chrome 扩展内存泄漏

    问题 我开发了一个扩展程序 可以拦截 Web 请求 获取 Web 请求来源的 HTML 并对其进行处理 我使用 DOMParser 来解析 HTML 并且意识到 DOMParser 正在导致大量内存泄漏问题 最终导致 chrome 扩展崩溃

随机推荐

  • 如何在 xsl if 中使用 xsl 变量

    我正在尝试将 xsl 变量中的值分配给 xml 文件中的新节点 此代码有效 但当 lbi GetCooperatives PVAL 的值为空时添加一个空的 PROP PVAL 节点
  • 如何根据依赖解析器的输出创建一棵树?

    我试图从依赖解析器的输出中创建一棵树 嵌套字典 这句话是 我在睡梦中射杀了一头大象 我能够获得链接中所述的输出 如何在 NLTK 中进行依存解析 https stackoverflow com questions 7443330 how d
  • 尝试 doSMP 示例时出错

    我尝试运行 doSMP 小插图中的简单示例 但出现以下错误 首先 我不确定如何存在现有的 doSMP 会话 因为我在重新启动计算机后立即执行了下面的代码 此外 关于包 doSMP 不存在的重复错误 但库 doSMP 调用工作正常 帮助 gt
  • 如何在 Android 模拟器中缩小 Google 地图?

    我正在模拟器上测试基于地图的应用程序 我通过在屏幕上双击鼠标来放大地图 但无法缩小 请告诉我如何缩小 双击然后按住第二次单击并向上 缩小 或向下 放大 移动鼠标
  • KineticJS 撤消图层:撤消时图层不会消失?

    我在 Canvas HTML5 中的设计器绘图工具上遇到了一个特定问题 我正在开发一个动作历史系统 撤消和重做 我正在构建我的系统projeqht的回答这个问题 https stackoverflow com questions 16096
  • React Hooks 上的 useState 不更新数组

    我已经尝试了很多方法 但似乎无法理解为什么 setTypes 不会更新 类型 数组 import useState useEffect from react import PostList from post list import as
  • 在 cassandra 中创建表时出错 - 错误请求:只能在 CLUSTERING ORDER 指令中定义集群键列

    当我尝试使用以下 cql 语句时出现上述错误 不确定它出了什么问题 CREATE TABLE Stocks id uuid market text symbol text value text time timestamp PRIMARY
  • glGenFramebuffers 还是 glGenFramebuffersEXT?

    我很困惑 要在 Windows 上的 OpenGL 1 x 中使用帧缓冲区对象扩展 FBO 我应使用以下哪一个 wglGetProcAddress glGenFramebuffers or wglGetProcAddress glGenFr
  • 将从 Promise 返回的值分配给全局变量

    我正在尝试从量角器读取浏览器内存值并将它们存储在全局对象中 为此 我获取 window performance memory 对象 然后解决检查每个内存值的承诺 问题是我似乎无法将值分配给全局变量 我尝试过以下代码 但似乎效果不太好 thi
  • 如果绑定,Bootstrap CSS table-striped 不适用于剔除

    假设我有下表适用于 bootstrap css 和淘汰赛 table class table table striped table bordered table hover table condensed tbody tr td td t
  • Python:“”未定义

    这是我的代码 This program makes the robot calculate the average amount of light in a simulated room from myro import init simu
  • 为什么FunctionN(0-22) ProductN(1-22) TupleN(1-22)?

    该 API 有 FunctionN 0 22 ProductN 1 22 TupleN 1 22 问题是 1 为什么数字是22结尾 为什么不是21或23 2 为什么函数以0开头 但 Product 和 Tuple 不是吗 拥有一个没有意义P
  • 防止 标记中自动换行

    我有一个htmlcode标签 包裹在pre具有固定宽度的标签 并且自动换行变得难看 我想要实现的是 文本不会自动在空格上断开 但是当我添加white space nowrap to the code元素 整个内容折叠成一行 因此所有 n 和
  • PyQt4:如何迭代 QListWidget 中的所有项目

    目前 我在继承 QtGui QListWidget 的类中使用以下 while 循环来迭代所有项目 i 0 while i lt self count item self item i i 1 我希望我可以使用 for item in se
  • OllyDbg 无法调试 Visual Studio exe

    我刚刚使用以下简单代码创建了一个新的 vc exe include
  • 如何在 SSMS 单元格中输入“NULL”?

    在 SQL Server Management Studio 2012 中 我将数据键入 粘贴到表中 通过编辑前 200 行 每当我输入 粘贴时NULL在一个细胞中 一个NULL值已插入 显然它认为我的意思是NULL值而不是 NULL 文本
  • 地址范围:寿命不够长

    我对这两个看似相似的程序的结果感到惊讶 fn main let y int 31i println My number is y Output My number is 31 但是 这段代码给了我一个错误 fn main let y int
  • 在 GAE/python 中存储密码的最佳实践

    我需要在我的 GAE python2 7 应用程序中实现密码存储 我已经实现了 cookie 进行授权 我已经有了帐户 用户模型 并且我已经通过第三方进行了身份验证 现在我需要通过密码添加身份验证 客户请求 我希望安全地存储密码 我已经确定
  • 具有自定义字体的 TextView 未垂直居中

    我需要使用自定义字体 VAG Rounded 可能不相关 但字体会改变我的 TextView 的反应方式 在下图中 您可以看到两个具有黑色背景的文本视图 左边一种使用自定义字体 右边一种使用默认系统字体 Roboto 它们都有相同的 xml
  • gulp - 缩小 CSS 时排除文件

    我是 Gulp 新手 我已经能够成功安装 连接和缩小我的 js 和 css 文件 但是 有一个我想排除的 css 文件 print css 我已按照此处的说明进行操作 https www npmjs org package gulp ign