- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时,我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
我正在尝试设置 gulp-spritesmith,每次在图标文件夹中粘贴某些内容时都会出现上述错误。还尝试让它在 mac 上通过 sass.Node 版本 2.14.12 进行编译。如果有任何其他更易于使用的“sprite”插件,请告知。
'use strict';
// Include gulp
var gulp = require('gulp');
// Include Our Plugins
var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var size = require('gulp-size');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var spritesmith = require('gulp-spritesmith');
var imagemin = require('gulp-imagemin');
var cssmin = require('gulp-cssmin');
var rename = require('gulp-rename');
// var cssnano = require('gulp-cssnano');
var sprity = require('sprity');
var gulpif = require('gulp-if');
var sources = {
scss: 'scss/**/*.scss',
images: 'img/**/*.{jpg|png|gif}',
sprites: 'img/sprite-src/*.png',
css: 'css/*.css'
}
/**
* Compiles SASS into CSS.
*/
gulp.task('scss', function () {
return gulp.src([sources.scss])
.pipe( sass({
includePaths:['node_modules/bootstrap-sass/assets/stylesheets'],
outputStyle: 'nested', // 'nested', 'compressed'
sourceComments: 'normal', // 'none', 'normal', 'map'
errLogToConsole: true,
}))
.pipe( autoprefixer('last 4 versions', '> 5%', 'ie 8') )
.pipe( gulp.dest('css') )
.pipe( size({title: 'styles:scss'}) );
});
// generate sprite.png and _sprite.scss
// gulp.task('sprites', function () {
// return sprity.src({
// name: 'sprites',
// cssPath: 'img/icons/*.png',
// src: 'img/icons/*.png}',
// style: 'css/sprite.css',
// processor: 'sass', // make sure you have installed sprity-sass
// })
// .pipe(gulpif('*.png', gulp.dest('img/sprite-src/'), gulp.dest('css/sprites/')))
// });
/**
* Create spritesheet
* Combines multiple .png's images into a single .png image. Outputs a .scss file with
* corresponding variables for each image in the spritesheet.
*/
gulp.task('sprite', function () {
var spriteData = gulp.src(sources.sprites)
.pipe( spritesmith({
cssName: '_sprite.scss',
cssFormat: 'css', // use .scss to get sprite generator mixin
imgName: 'sprite.png',
imgPath: 'img/sprite.png', // the path our css will reference
algorithm: 'binary-tree',
padding: 1, // prevents pixel rounding issues when we use CSS transforms on sprites
cssOpts: {
cssClass: function (item) {
return '.sprite-' + item.name;
}
}
}));
// Optimize and output the generated spritesheet image
spriteData.img.pipe( imagemin()).pipe( gulp.dest('img/') ).pipe( size({title: 'sprite'}) );
// Output the generated .scss file
spriteData.css.pipe( gulp.dest('scss/helper/') );
});
// Css Minify
gulp.task('minifycss', function () {
gulp.src('css/main.css')
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('css'));
});
// Lint Task
gulp.task('lint', function() {
return gulp.src('js/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
// Concatenate & Minify JS
gulp.task('scripts', function() {
return gulp.src('js/*.js')
.pipe(concat('jsConcat.js'))
.pipe(gulp.dest('js'))
.pipe(rename('jsConcat.min.js'))
.pipe(uglify())
.pipe(gulp.dest('js'));
});
// Watch Files For Changes
gulp.task('watch', function() {
gulp.watch(sources.scss, ['scss']);
gulp.watch('css/*.css', ['minifycss']);
// gulp.watch(sources.css, ['default']);
gulp.watch('js/*.js', ['lint', 'scripts']);
gulp.watch('img/icons/*.png', ['sprite']);
});
// Default Task
gulp.task('default', ['watch']);
我的 package.json 文件如下所示
{
"name": "",
"version": "1.0.0",
"description": "Caxton Digital Front End Gulp Build",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Munei Nengwenani",
"dependencies": {
"bootstrap-sass": "^3.3.6"
},
"devDependencies": {
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.0",
"gulp-concat": "^2.6.0",
"gulp-cssmin": "^0.1.7",
"gulp-cssnano": "^2.1.0",
"gulp-if": "^2.0.0",
"gulp-imagemin": "^2.4.0",
"gulp-jshint": "^2.0.0",
"gulp-minify-css": "^1.2.3",
"gulp-rename": "^1.2.2",
"gulp-sass": "^2.2.0",
"gulp-size": "^2.0.0",
"gulp-uglify": "^1.5.2",
"gulp-watch": "^4.3.5",
"gulp.spritesmith": "^6.2.0",
"jshint": "^2.9.1",
"sprity": "^1.0.8",
"sprity-sass": "^1.0.4"
},
"engines": {
"node": ">=0.10.0"
},
"private": true,
"license": "WTFPL"
}
最佳答案
参见https://github.com/twolfson/gulp.spritesmith#breaking-changes-in-600
根据该链接上的文档,在 spritesmith 版本 6 中,如果您的图像管道需要缓冲内容而不是流,您可能需要使用乙烯基,例如
var buffer = require('vinyl-buffer');
spriteData.img.pipe(buffer()).pipe(imagemin());
关于javascript - 类型错误 : Cannot read property 'pipe' of undefined gulpjs,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35357395/
我只是有一个更琐碎的问题。 为什么undefined == undefined 返回true,而undefined >= undefined 为false? undefined 等于 undefine
用PHP 7.2编写套接字服务器。根据Firefox 60中的“网络”选项卡,服务器的一些HTTP响应的第一行随机变为undefined undefined undefined。因此,我尝试记录套接字
在 JavaScript 中这是真的: undefined == undefined 但这是错误的: undefined <= undefined 起初我以为<=运算符包含第一个,但我猜它试图将其转换
在回答这个问题 (Difference between [Object, Object] and Array(2)) 时,我在 JavaScript 数组中遇到了一些我以前不知道的东西(具有讽刺意味的
来自https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/of , Note: thi
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
当我添加 到我的 PrimeFaces Mobile 页面,然后我在服务器日志中收到以下警告 WARNING: JSF1064: Unable to find or serve resource, u
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我正在运行 PHP 脚本并继续收到如下错误: Notice: Undefined variable: my_variable_name in C:\wamp\www\mypath\index.php
我是一名优秀的程序员,十分优秀!