Как подружить Phpstorm и gulp-sass @import?

Question

[brees]

Таск галпа:

gulp.task('styles', () => {
  return gulp.src('./src/main.sass')
      .pipe(sass({
        includePaths: ['node_modules']
      }))
      .pipe(gulp.dest('./dist'));
});

Подсветка синтаксиса в phpstorm происходит только при указании путя через тильду:

spoiler

Но при таком конфиге мы получим ошибку:

spoiler

Если я правильно понимаю, тильда указывает на node_modules, но работает только в js, можно ли как-то указывать пути через неё в .sass файлах ? Или есть другие способы добавить поддержку подсказки путей в phpstorm, чтобы не было такого:

spoiler

Comments

[zorca]

Все шикарно работает с такими путями, НО, когда используется Webpack. Поэтому в вашем случае нужно указать полный путь до пакета. Так как используете includePaths, то достаточно убрать тильду.

[brees]

zorca, имеете ввиду полный путь
@import '../node_modules/bootstrap/......' ?

[zorca]

brees, попробуйте просто тильду убрать в пути

[brees]

zorca, да без тильды сборка запустится и всё соберётся как нужно, но phpstorm будет подсвечивать ошибку

[zorca]

brees, если только это беспокоит, то почитайте это: https://stackoverflow.com/questions/49235176/using...
Вкратце, Шторму нужно указать, где он должен искать ресурсы.

В вашем случае рутом для ресурсов нужно пометить папку node_modules

[zorca]

Вариант номер два - поставьте готовый сборщик Laravel Mix и забудьте про написание галп-файлов.

[brees]

zorca, спасибо, посмотрю в сторону ларавель микса, не уверен, что получится легко перенести то, что есть сейчас(кривая сборка на gulp4 для битрикс). Сейчас я хочу перенести js с gulp-concat на вебпак, не знаю получится ли и sass собирать через него(sass Разбит хаотично и подключается в одном файле main.sass, т.е. никакой модульности или компонентов), или лучше стили оставить на галпе как сейчас ?

[zorca]

brees, все просто переносится, пара минут