@Pizert

Почему не работает сборка gulp?

Делаю сборку 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)
  • Вопрос задан
  • 489 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы