首页 > 解决方案 > TypeError [ERR_INVALID_ARG_TYPE]:第一个参数必须是 string、Buffer、ArrayBuffer、Array 或 Array-like Object 类型之一

问题描述

需要部署一个旧项目。稍微更正了 gulpfile.js 以便程序集开始运行,它遇到了一个错误:

[21:12:57] Finished 'html:build' after 71 ms
[21:12:57] Starting 'js:build'...
[21:12:57] 'js:build' errored after 15 ms
[21:12:57] TypeError [ERR_INVALID_ARG_TYPE]: The first argument must be one of type string, Buffer, 
ArrayBuffer, Array, or Array-like Object. Received type undefined
at Function.from (buffer.js:207:11)
at new Buffer (buffer.js:182:17)
at G:\firststep\odc-client-app-2019-clean-html\node_modules\gulp-rigger\index.js:20:29
at Rigger.<anonymous> (G:\firststep\odc-client-app-2019-clean- 
html\node_modules\rigger\index.js:719:9)
at Rigger.emit (events.js:182:13)
at Rigger.EventEmitter.emit (domain.js:441:20)
at G:\firststep\odc-client-app-2019-clean-html\node_modules\rigger\index.js:252:16
at G:\firststep\odc-client-app-2019-clean-html\node_modules\async\lib\async.js:232:13
at G:\firststep\odc-client-app-2019-clean-html\node_modules\async\lib\async.js:113:21
at G:\firststep\odc-client-app-2019-clean-html\node_modules\async\lib\async.js:24:16
[21:12:57] 'build' errored after 87 ms
[21:12:57] 'default' errored after 89 ms

gulpfile.js:

'use strict';

var gulp = require('gulp'),
	watch = require('gulp-watch'),
	prefixer = require('gulp-autoprefixer'),
	uglify = require('gulp-uglify'),
	cssmin = require('gulp-cssmin'),
	sass = require('gulp-sass'),
	sourcemaps = require('gulp-sourcemaps'),
	rigger = require('gulp-rigger'),
	imagemin = require('gulp-imagemin'),
	pngquant = require('imagemin-pngquant'),
	rimraf = require('rimraf'),
	connect = require('gulp-connect'),
	opn = require('opn'),
	notify = require('gulp-notify'),
	copy = require('gulp-copy'),
	plumber = require('gulp-plumber'),
	less = require('fd-gulp-less');

var path = {
	build: {
		html: 'build/',
		js: 'build/assets/sys/js/',
		css: 'build/assets/sys/css/',
		img: 'build/assets/sys/img/',
		fonts: 'build/assets/sys/fonts/'
	},
	src: {
		html: 'src/*.html',
		js: 'src/js/main.js',
		style: 'src/style/style.less',
		img: 'src/img/**/*.*',
		fonts: 'src/fonts/**/*.*'
	},
	watch: {
		html: 'src/**/*.html',
		js: 'src/js/**/*.js',
		style: 'src/style/**/*.less',
		img: 'src/img/**/*.*',
		fonts: 'src/fonts/**/*.*'
	},
	clean: './build'
};

var server = {
	host: 'localhost',
	port: '1495'
};

gulp.task('clean', function (cb) {
	rimraf(path.clean, cb);
});

gulp.task('webserver', function() {
	connect.server({
		host: server.host,
		port: server.port,
		livereload: true
	});
});

gulp.task('webserver-stop', function() {
	connect.server({
		host: server.host,
		port: server.port,
		livereload: true
	});
	connect.serverClose();
});

gulp.task('openbrowser', function() {
	opn( 'http://' + server.host + ':' + server.port + '/build' );
});

gulp.task('html:build', function () {
	return gulp.src(path.src.html)
		.pipe(plumber({
			errorHandler: function (err) {
				console.log(err);
				this.emit('end');
			}
		}))
		.pipe(rigger())
		.pipe(gulp.dest(path.build.html))
		.pipe(notify('HTML: Done!'))
		.pipe(connect.reload());
});

gulp.task('js:build', function () {
	gulp.src(path.src.js)
		.pipe(plumber({
			errorHandler: function (err) {
				console.log(err);
				this.emit('end');
			}
		}))
		.pipe(rigger())
		.pipe(sourcemaps.init())
		.pipe(uglify())
		.pipe(sourcemaps.write())
		.pipe(gulp.dest(path.build.js))
		.pipe(notify('JS: Done!'))
		.pipe(connect.reload());
});

gulp.task('style:build', function () {
	gulp.src(path.src.style)
		.pipe(plumber({
			errorHandler: function (err) {
				console.log(err);
				this.emit('end');
			}
		}))
		// .pipe(sourcemaps.init())
		.pipe(less())
		.pipe(prefixer())
		.pipe(cssmin())
		// .pipe(sourcemaps.write())
		.pipe(gulp.dest(path.build.css))
		.pipe(notify('CSS: Done!'))
		.pipe(connect.reload());
});

gulp.task('image:build', function () {
	gulp.src(path.src.img)
		.pipe(imagemin({
			progressive: true,
			svgoPlugins: [{removeViewBox: false}, {cleanupIDs: false}],
			use: [pngquant()],
			interlaced: true
		}))
		.pipe(gulp.dest(path.build.img))
		.pipe(notify('IMG: Done!'))
		.pipe(connect.reload());
});

gulp.task('fonts:build', function() {
	gulp.src(path.src.fonts)
		.pipe(gulp.dest(path.build.fonts))
		.pipe(notify('FONTS: Done!'));
});

gulp.task('build', gulp.series(
	'html:build',
	'js:build',
	'style:build',
	'fonts:build',
	'image:build'
));

gulp.task('watch', function(){
	watch([path.watch.html], function(event, cb) {
		gulp.start('html:build');
	});
	watch([path.watch.style], function(event, cb) {
		gulp.start('style:build');
	});
	watch([path.watch.js], function(event, cb) {
		gulp.start('js:build');
	});
	watch([path.watch.img], function(event, cb) {
		gulp.start('image:build');
	});
	watch([path.watch.fonts], function(event, cb) {
		gulp.start('fonts:build');
	});
});

gulp.task('default', gulp.series('build', 'webserver-stop', 'webserver', 'watch', 'openbrowser'));
gulp.task('start', gulp.series('build', 'webserver-stop', 'webserver', 'watch'));
gulp.task('stop', gulp.series('webserver-stop'));
//gulp.task('default', ['build', 'watch', 'openbrowser']);

我尝试npm install jquery --save-dev是因为我在谷歌中找到了这样的提示,但它没有帮助,也尝试bower install jquery --save-dev了,因为项目中有凉亭,但它也没有帮助。如何修复组件?对不起英语不好。

标签: javascriptgulpbower

解决方案


我只是有同样的错误。错误的来源是 gulp-rigger 包。尝试删除它,看看是否有效。

ps 我用gulp-include替换了 gulp-rigger


推荐阅读