javascript - 这是什么意思:TypeError: dest.on is not a function
问题描述
我是一个新手,正在学习有关现代 webdev 工作流程的教程。我在控制台中收到此错误消息。TypeError: dest.on is not a function
我知道,这里有相关的问题和答案。但我不明白他们。因为我不知道“dest.on”与什么有关,它有什么作用。这是到目前为止的代码:
var gulp = require("gulp");
var sass = require("gulp-sass");
var sourcemaps = require("gulp-sourcemaps");
var autoprefixer = require("auto-prefixer");
var imagemin = require("gulp-imagemin");
var browserSync = require("browser-sync").create();
gulp.task("css", function() {
return gulp
.src("src/sass/**/*.scss")
.pipe(sourcemaps.init())
.pipe(sass({ outputStyle: "compressed" }).on("error", sass.logError))
.pipe(
autoprefixer({
browsers: ["last 2 versions"]
})
)
.pipe(sourcemaps.write("./maps"))
.pipe(gulp.dest("dist/css"));
});
谁能解释一下错误消息的含义以及我如何解决这个特定问题?对于冗余,我很抱歉,但我在现有答案中没有找到解决方案。
编辑::::::::::::::::::::::::::::::::::::::::::::::::: ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 也许它有助于添加 package.json
{
"name": "sitepointresponsivewebsite",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"auto-prefixer": "^0.4.2",
"browser-sync": "^2.26.3",
"gulp": "^4.0.0",
"gulp-imagemin": "^5.0.3",
"gulp-sass": "^4.0.2",
"gulp-sourcemaps": "^2.6.5"
}
}
这是完整的终端错误消息
Beratungs-MacBook-Pro-2:sitepointResponsiveWebsite Beratung1$ gulp css
[14:04:02] Using gulpfile ~/Desktop/sitepointResponsiveWebsite/gulpfile.js
[14:04:02] Starting 'css'...
[14:04:02] 'css' errored after 12 ms
[14:04:02] TypeError: dest.on is not a function
at DestroyableTransform.Readable.pipe (/Users/Beratung1/Desktop/sitepointResponsiveWebsite/node_modules/readable-stream/lib/_stream_readable.js:564:8)
at /Users/Beratung1/Desktop/sitepointResponsiveWebsite/gulpfile.js:13:6
at taskWrapper (/Users/Beratung1/Desktop/sitepointResponsiveWebsite/node_modules/undertaker/lib/set-task.js:13:15)
at bound (domain.js:396:14)
at runBound (domain.js:409:12)
at asyncRunner (/Users/Beratung1/Desktop/sitepointResponsiveWebsite/node_modules/async-done/index.js:55:18)
at process._tickCallback (internal/process/next_tick.js:61:11)
解决方案
对于像这样不熟悉的错误消息,堆栈跟踪通常是最有帮助的。
at DestroyableTransform.Readable.pipe (/Users/Beratung1/Desktop/sitepointResponsiveWebsite/node_modules/readable-stream/lib/_stream_readable.js:564:8)
at /Users/Beratung1/Desktop/sitepointResponsiveWebsite/gulpfile.js:13:6
错误发生在pipe()
可读流中的方法中。dest
是 的第一个参数的名称pipe()
;“dest.on”不存在的事实意味着您传递给的东西pipe()
实际上不是流。
第二个堆栈帧指的是第 13 行,也就是这个pipe()
调用:
.pipe(
autoprefixer({
browsers: ["last 2 versions"]
})
)
因此, autoprefixer() 的返回值不是流。
autoprefixer
是:
var autoprefixer = require("auto-prefixer");
在 npm 上查看该模块:https ://www.npmjs.com/package/auto-prefixer 。看起来很奇怪,但它绝对不是流 API。
真正的autoprefixer模块被称为autoprefixer
,没有破折号。您可以将它与 gulp-postcss 一起使用,如下所述:https ://www.npmjs.com/package/autoprefixer#gulp
var postcss = require('gulp-postcss')
var autoprefixer = require('autoprefixer')
// .. etc ..
.pipe(postcss([ autoprefixer({
// .. options ..
}) ]))
推荐阅读
- css - 在 wordpress 上开发主题时如何解决邮件代码问题?
- xamarin - 在 Xamarin.Forms 中找不到可绘制文件夹
- java - rxjava 超时时跳过项目并继续下一个项目
- android-constraintlayout - 在设计模式下看不到我的视图。约束布局
- sharepoint - restapi 查找列共享点
- amazon-web-services - 无法将列表值分配给 Terraform 中的 json 策略
- angular - 如何使角垫表中的排序箭头始终可见?
- docker - 不使用 ssh 或 docker.sock 从其他容器执行 docker exec 命令
- php - 更改远程服务器上的 JSON 文件
- javascript - 如何用同一对象的另一个键的值更改对象的键值?