如何修复"cannot find module 'gulp-babel'"？

Question

我正在通过"Learning JavaScript"一书学习JS。第 3 版" 当涉及到转译器时，我所做的一切都与书中完全相同，当我在 Bash 中输入 gulp 时，我仍然遇到错误。我能做些什么来修复它吗？

尝试安装@babel/核心，babel-env 尝试在gulpfile中进行微小的更改.js 搜索了互联网，但找不到答案...

包.json

"author": "",
"license": "ISC",
"dependencies": {
"underscore": "^1.9.1"
},
"devDependencies": {
"@babel/cli": "^7.5.5",
"@babel/core": "^7.5.5",
"@babel/preset-env": "^7.5.5",
"babel": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"gulp": "^4.0.2",
"gulp-babel": "^8.0.0"
}
}

古尔普文件.js

const gulp = require('gulp');
const babel = require('gulp-babel');
gulp.task('default', function() {
gulp.src("es6/**/*.js")
.pipe(babel({
presets: ['@babael/env']
}))
.pipe(gulp.dest("dist"));
gulp.src("public/es6/**/*.js")
.pipe(babel())
.pipe(gulp.dest("public/dist"))
});

巴贝尔尔克

{ 
"presets": ["es2015"]
}

错误是： 内部/模块/CJS/加载器.js：628 投掷错误; ^

Error: Cannot find module 'gulp-babel'
Require stack:
- C:Usersarchitestljgulpfile.js
- C:UsersarchiAppDataRoamingnpmnode_modulesgulp- 
clilibversioned^4.0.0index.js
- C:UsersarchiAppDataRoamingnpmnode_modulesgulp-cliindex.js
- C:UsersarchiAppDataRoamingnpmnode_modulesgulp-clibingulp.js
at Function.Module._resolveFilename 
(internal/modules/cjs/loader.js:625:15)
at Function.Module._load (internal/modules/cjs/loader.js:527:27)
at Module.require (internal/modules/cjs/loader.js:683:19)
at require (internal/modules/cjs/helpers.js:16:16)
at Object.<anonymous> (C:Usersarchitestljgulpfile.js:2:15)
at Module._compile (internal/modules/cjs/loader.js:776:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
at Module.load (internal/modules/cjs/loader.js:643:32)
at Function.Module._load (internal/modules/cjs/loader.js:556:12)
at Module.require (internal/modules/cjs/loader.js:683:19) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\Users\archi\test\lj\gulpfile.js',
'C:\Users\archi\AppData\Roaming\npm\node_modules\gulp-cli\lib\versioned\^4.0.0\index.js',
'C:\Users\archi\AppData\Roaming\npm\node_modules\gulp-cli\index.js',
'C:\Users\archi\AppData\Roaming\npm\node_modules\gulp-cli\bin\gulp.js'
]
}

Answer 1

你需要 babel 核心：

使用 npm：

npm install --save-dev @babel/core

使用纱线：

yarn add @babel/core --dev

Answer 2

按照以下步骤操作，gulp 文件中的任务将成功运行(无警告)：

1. 安装 gulp-babel、babel-core 和 preset-env

$ npm install --save-dev gulp-babel @babel/core @babel/preset-env

2. 修改 .babelrc 如下：

// .babelrc
{"presets": ["@babel/env"]}

3. 给 gulp 任务添加回调

const gulp = require('gulp');
const babel = require('gulp-babel');
gulp.task('default', function(callback) {
// Node source
gulp.src("es6/**/*.js")
.pipe(babel())
.pipe(gulp.dest("dist"));
// browser source
gulp.src("public/es6/**/*.js")
.pipe(babel())
.pipe(gulp.dest("public/dist"));

callback();
});