Да, вебпак позволяет импортировать файлы SASS в шаблон Pug. Для этого требуется настроить правильно конфигурацию вебпак.
Во-первых, установите необходимые зависимости, если они еще не установлены:
npm install sass-loader node-sass pug-loader --save-dev
Затем настройте конфигурацию вебпак. Откройте файл webpack.config.js
и добавьте правила для обработки файлов SASS и Pug:
module.exports = { // ...другие настройки конфигурации module: { rules: [ // Правило для обработки файлов SASS { test: /.sass$/, use: [ 'style-loader', 'css-loader', 'sass-loader' ] }, // Правило для обработки файлов Pug { test: /.pug$/, use: 'pug-loader' } ] } };
Вышеуказанный конфигурация позволяет импортировать файлы SASS в Pug, а также автоматически преобразует их в CSS. Импортирование файлов SASS в Pug происходит с использованием обычного синтаксиса @import
:
style include style.sass
В результате, при компиляции Pug вебпаком, файл style.sass
будет вставлен в соответствующий тег style
на странице.
Не забудьте также добавить соответствующие скрипты в вашу HTML-разметку, чтобы вебпак подключал все необходимые зависимости.
Это только один из возможных способов настройки вебпак для импорта SASS в Pug. Возможны и другие варианты настройки, в зависимости от конкретных потребностей вашего проекта.