0

У меня есть такой модуль для обработки стилей:

import autoPrefixer from "gulp-autoprefixer"
import groupCssMediaQueries from "gulp-group-css-media-queries"
import GulpCleanCss from "gulp-clean-css"
import dartSass from "sass"
import gulpSass from "gulp-sass"

const sass = gulpSass(dartSass);

export const scss = () => {
    return app.gulp.src(app.path.src.css, { sourcemaps: true })
        .pipe(app.plugins.cached("css"))
        .pipe(app.plugins.newer(app.path.build.css))
        .pipe(
            sass({
                outputStyle: "expanded"
            })
        )
        .pipe(
            groupCssMediaQueries()
        )
        .pipe(
            autoPrefixer({
                overrideBrowserslist: ["last 5 version"],
                cascade: true
            })
        )
        .pipe(app.plugins.remember("css"))
        .pipe(webpcss())
        .pipe(dest(app.path.build.css))
        .pipe(GulpCleanCss())
        .pipe(
            app.plugins.rename({
                extname: ".min.css"
            })
        )
        .pipe(app.gulp.dest(path.build.css))
        .pipe(app.plugins.browsersync.stream())
}

В app.plugins находятся общие для сбоки плагины, но это не важно. Тут

const sass = gulpSass(dartSass);

Я сохранил функцию gulpSass и передал в нее компилятор. То есть в sass по идее функция, но я получаю ошибку sass is not a function. При этом в этом уроке у автора все работает (51:25) и в документации предлагают подключать и использовать модуль именно так.

To use gulp-sass in an ECMAScript module (which is supported in newer Node.js 14 and later), do something like this:

import dartSass from 'sass';
import gulpSass from 'gulp-sass';
const sass = gulpSass(dartSass);

Usage

gulp-sass must be used in a Gulp task. Your task can call sass() (to asynchronously render your CSS), or sass.sync() (to synchronously render your CSS).

Почему я получаю ошибку? Как это исправить, что я проглядел?

P.S. Объект находящийся в sass:

DestroyableTransform {
  _readableState: ReadableState {
    objectMode: true,
    highWaterMark: 16,
    buffer: BufferList { length: 0 },
    length: 0,
    pipes: null,
    pipesCount: 0,
    flowing: null,
    ended: false,
    endEmitted: false,
    reading: false,
    sync: false,
    needReadable: true,
    emittedReadable: false,
    readableListening: false,
    resumeScheduled: false,
    destroyed: false,
    defaultEncoding: 'utf8',
    awaitDrain: 0,
    readingMore: false,
    decoder: null,
    encoding: null
  },
  readable: true,
  _events: [Object: null prototype] {
    end: [Function: bound onceWrapper] { listener: [Function: onend] },
    prefinish: [Function: prefinish]
  },
  _eventsCount: 2,
  _maxListeners: undefined,
  _writableState: WritableState {
    objectMode: true,
    highWaterMark: 16,
    finalCalled: false,
    needDrain: false,
    ending: false,
    ended: false,
    finished: false,
    destroyed: false,
    decodeStrings: true,
    defaultEncoding: 'utf8',
    length: 0,
    writing: false,
    corked: 0,
    sync: true,
    bufferProcessing: false,
    onwrite: [Function (anonymous)],
    writecb: null,
    writelen: 0,
    bufferedRequest: null,
    lastBufferedRequest: null,
    pendingcb: 0,
    prefinished: false,
    errorEmitted: false,
    bufferedRequestCount: 0,
    corkedRequestsFree: CorkedRequest {
      next: null,
      entry: null,
      finish: [Function (anonymous)]
    }
  },
  writable: true,
  allowHalfOpen: true,
  _transformState: {
    afterTransform: [Function: bound afterTransform],
    needTransform: false,
    transforming: false,
    writecb: null,
    writechunk: null,
    writeencoding: null
  },
  _destroyed: false,
  _transform: [Function (anonymous)],
  [Symbol(kCapture)]: false
}

Версия node js - 14.17.6 Gulp 4.0.2

2
  • console.log(sass), node.js version... 7 янв 2022 в 11:25
  • @nörbörnën верисия node 14.17.6 7 янв 2022 в 11:49

1 ответ 1

0

Не знаю, в чем была проблема. Чистил кэш npm, удалял и ставил sass и gulp-sass заново, ничего не помогло.

Я создал новый проект через npm init, перевел его в модульный режим и импортировал туда только нужные для функции модули - все заработало. Видимо модуль конфликтует с каким-то другим из моей старой сборки. Буду потихоньку инсталировать остальные, и если вылезет та же ошибка дополню ответ.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.