Как правильно подключить normalize к gulp?

Question

[BB 8]

Скачал normalize(npm i -D normalize.css)

Как правильно подключить его в GULP'e, чтобы можно его было импортировать через файл libs.sass или main.sass или чтобы он сам автоматически импортировался ??

Сам normalize находится в папке 'node_modules', и не очень удобно обращаться к нему через директиву @import.

Comments

[Ярослав Иванов]

ты лучше расскажи как гифку на аву поставил)))

Answer 1

[alvvi]

https://github.com/sass/node-sass#includepaths

p.s. в gulp-sass оно тоже работает

Comments

[BB 8]

Всё-таки придется жестко указывать путь(node_modules/way_to_normalize/norm.css) ???

[alvvi]

BB 8: нет, просто укажите опцию includePaths: [paths] в вашем gulp-sass/node-sass, где paths - строки с путями к нужным файлам. Пример: includePaths: ['./node_modules/bootstrap/scss']
теперь в sass могу написать
@import 'bootstrap'
и он импортирует мне так же, как если бы я написал

@import '../../node_modules/bootstrap/scss/bootstrap'

Так же в includePaths можно передать абсолютный путь, если надо.

[BB 8]

Илья Ростопка:

Message:
    app/sass/main.sass
Error: File to import not found or unreadable: normalize.
       Parent style sheet: /home/bb-8/Documents/landing-page-on-flexbox-master/app/sass/main.sass
        on line 1 of app/sass/main.sass
>> @import 'normalize';

gulp.task('sass', function(){ // Создаем таск Sass
    return gulp.src('app/sass/**/*.sass') // Берем источник
        .pipe(sass({includePaths: ['./node_modules/normalize.css/']}).on('error', sass.logError)) // Преобразуем Sass в CSS посредством gulp-sass
        .pipe(autoprefixer(['last 15 versions', '> 1%', 'ie 8', 'ie 7'], { cascade: true })) // Создаем префиксы
        .pipe(gulp.dest('app/css')) // Выгружаем результата в папку app/css
        .pipe(browserSync.reload({stream: true})); // Обновляем CSS на странице при изменении
});

Что я делаю не так? :D

в .sass пишу @import 'normalize';

[alvvi]

BB 8: а если пройти по пути './node_modules/normalize.css/' есть ли там сам normalize.css? В принципе все правильно делаете, но при разрешени импротов ошибки - частое явление. Попробуйте явно указать расширение, при компиляции scss вроде бывают порблемы с этим.

[BB 8]

Да, вот он :)

[BB 8]

'./node_modules/normalize.css/ = 'node_modules/normalize.css/'

Вроде все указываю правильно, но почему-то не работет :)

[alvvi]

BB 8: @import 'normalize.css'
тоже не работает? Советую поискать в старых вопросах про includePaths и @import, их было немало, и решения сложно описать одним комментом. Вот тут много решений.

[BB 8]

Илья Ростопка:@import 'normalize.css' компилит в @import url(normalize.css);:D

[alvvi]

BB 8: да, соре, это я уже туплю, в любом случае попробуйте решения из того вопроса