Делаю сборку Gulp. Часть брал из видео, потом решил переписать, чтобы работал imagemin новой версии. С функциями htmlInclude, styles, watchFiles все отлично. Сборка стартует и выполняет свои задачи. Но вот решил добавить очистку папки и возникли ошибки.
Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'del' imported from E:\FrontEnd\gulp-builder\gulpfile.js
at new NodeError (node:internal/errors:372:5)
at packageResolve (node:internal/modules/esm/resolve:954:9)
at moduleResolve (node:internal/modules/esm/resolve:1003:20)
at defaultResolve (node:internal/modules/esm/resolve:1218:11)
at ESMLoader.resolve (node:internal/modules/esm/loader:580:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40)
at link (node:internal/modules/esm/module_job:78:36) {
code: 'ERR_MODULE_NOT_FOUND'
}
Я так понимаю, что он не может найти модуль del. Но в package.json он прописан. Установил другую сборку с гитхаба, где есть del и все работает нормально. А у меня почему-то не устанавливается del. Если запустить его установку, то пишет такое:
npm ERR! code EBADPLATFORM
npm ERR! notsup Unsupported platform for inotify@1.4.6: wanted {"os":"linux"} (current: {"os":"win32","arch":"x64"})
npm ERR! notsup Valid OS: linux
npm ERR! notsup Valid Arch: undefined
npm ERR! notsup Actual OS: win32
npm ERR! notsup Actual Arch: x64
Вот файл package.json
{
"name": "gulp-builder",
"version": "1.0.0",
"description": "gulp-builder for weblayout",
"main": "./index.js",
"author": "",
"type": "module",
"browserslist": [
"last 10 versions"
],
"license": "ISC",
"devDependencies": {
"autoprefixer": "^10.4.7",
"browser-sync": "^2.27.10",
"gulp": "^4.0.2",
"gulp-clean-css": "^4.3.0",
"del": "^6.1.1",
"gulp-file-include": "^2.3.0",
"gulp-imagemin": "^8.0.0",
"gulp-plumber": "^1.2.1",
"gulp-postcss": "^9.0.1",
"gulp-rename": "^2.0.0",
"gulp-sass": "^5.1.0",
"gulp-sourcemaps": "^3.0.0",
"gulp-svg-sprite": "^1.5.0",
"gulp-ttf2woff": "^1.1.1",
"gulp-ttf2woff2": "^4.0.1",
"sass": "^1.54.0",
"postcss": "^8.4.14"
}
}
А вот файл gulpfile.js
import pkg from 'gulp'
const { gulp, src, dest, parallel, series, watch } = pkg
import dartSass from 'sass'
import gulpSass from 'gulp-sass'
const sass = gulpSass(dartSass)
import postCss from 'gulp-postcss'
import sourcemaps from 'gulp-sourcemaps'
import rename from 'gulp-rename'
import autoprefixer from 'autoprefixer'
import cleanCSS from 'gulp-clean-css'
import browserSync from 'browser-sync'
import fileinclude from 'gulp-file-include'
import del from 'del'
function clean() {
return del(['./app'])
}
function htmlInclude() {
return src (['./src/*.html'])
.pipe(fileinclude({
prefix: '@',
basepath: '@file'
}))
.pipe(dest('./app'))
.pipe(browserSync.stream());
}
function styles() {
return src('./src/scss/**/*.scss')
.pipe(sourcemaps.init())
.pipe(sass())
.pipe(rename({
suffix: '.min'
}))
.pipe(postCss([
autoprefixer({ grid: 'autoplace' })
]))
.pipe(cleanCSS({
level: 2
}))
.pipe(sourcemaps.write('.'))
.pipe(dest('./app/css/'))
.pipe(browserSync.stream());
}
function watchFiles() {
browserSync.init({
server: {
baseDir: "./app"
},
});
watch('./src/index.html', htmlInclude);
watch('./src/scss/**/*.scss', styles);
}
export {clean, styles, watchFiles}
export default series(htmlInclude, styles, watchFiles)
Простой
