Не работает extends в nunjucks

ошибок не выдает. Просто не работает и все.

Вот от сюда хочу импортировать

{% extends "header-menu.njk" %}

{% block cnob %}
    <a href="#">
        <div class="hello">Hello nunjucks</div>
    </a>
{% endblock %}

Вот сюда

<div class="header">    
    <div class="wrapper"> 
        <div class="header__body"> <a class="header__logo" href="#"> 
                <div class="logo">logo</div></a>
            <div class="header__burger"><span></span></div>
            <nav class="header__menu">
                <ul class="header__list">
                    <li><a class="header__link">О нас</a></li>
                    <li><a class="header__link">Оплата и доставка</a></li>
                    <li><a class="header__link">Новости</a></li>
                    <li><a class="header__link">Контакты</a></li>
                    <li><a class="header__link">Соцсети </a></li>
                    <li><a class="header__link">Товары</a></li>
                    <li><a class="header__link">Товары</a></li>
                    <li><a class="header__link">Товары</a></li>
                    <li></li>
                    {% block cnob %}{% endblock %}
                </ul>
            </nav>
        </div>
    </div>
</div>

вот от сюдавот сюда


картинка

gulp file


const { src, dest, watch, parallel, series } = require('gulp');
const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const concat = require('gulp-concat');
const browserSync = require('browser-sync').create();
const uglify = require('gulp-uglify-es').default;
const autoPrefixer = require('gulp-autoprefixer');
const imagemin = require('gulp-imagemin');
const del = require('del');
const gcmq = require('gulp-group-css-media-queries');
const sourcemaps = require('gulp-sourcemaps');
const babel = require('gulp-babel');
const webp = require('gulp-webp');
const svg2png = require('gulp-svg2png');
const webpHTML = require('gulp-webp-html');
const webpcss = require("gulp-webpcss");
const fonter = require('gulp-fonter');
const ttf2woff2 = require('gulp-ttf2woff2');
const iconfont = require('gulp-iconfont');
const iconfontcss = require('gulp-iconfont-css');
const fontName = 'somename';
const jshint = require('gulp-jshint');
const rename = require("gulp-rename");
const legacyIeCssLint = require('gulp-legacy-ie-css-lint');
const nunjucksRender = require('gulp-nunjucks-render');




//////////////////////////////////////////////////////
function iconFontCss() {
    return src(['app/images/icon/*.svg'])
        .pipe(iconfontcss({
            fontName: fontName,
            path: 'app/css/templates/_icons.scss',
            targetPath: '../scss/_icons.scss',
            fontPath: '../fonts/icons/',
        }))
        .pipe(iconfont({
            fontName: fontName,
            normalize: true,
            fontHeight: 1000,
            formats: ['svg', 'ttf', 'eot', 'woff', 'woff2']
        }))
        .pipe(dest('app/fonts/icons/'));
}


//////////////////////////////////////////
function Fonts() {
    return src('app/fonts/*')
        .pipe(fonter({
            subset: [66, 67, 68, 69, 70, 71],
            formats: ['woff', 'ttf', 'otf', 'eot']
        }))
        .pipe(dest('app/fonts/build'))
        .pipe(ttf2woff2())
        .pipe(dest('app/fonts/build'))
}


/////////////////////////////////////////
function html() {
    return src('app/pages/**/*.njk')
        .pipe(nunjucksRender({
            path: [
                'app/pages',
                'app/pages/include',
                'app/pages/include/modules',
            ]
        }))
        .pipe(dest('app'))
        .pipe(browserSync.stream())
}


function webpHtml() {
    return src('app/**/*.html')
        .pipe(webpHTML())
        .pipe(dest('app'))
}

///////////////////////////////////////////////


function styles() {
    return src('app/scss/main.scss')
        .pipe(sourcemaps.init())

        .pipe(sass({ outputStyle: 'compressed' }))
        .pipe(autoPrefixer({
            overrideBrowserslist: ['last 10 version'],
            grid: true
        }))
        .pipe(legacyIeCssLint({
            throw: true,
            log: true
        }))
        .pipe(concat('style.min.css'))
        .pipe(sourcemaps.write('.'))
        .pipe(dest('app/css'))
        .pipe(browserSync.stream())
}

function StyleWebp() {
    return src('app/css/style.min.css')
        .pipe(gcmq())
        .pipe(webpcss({}))
        .pipe(dest('app/css'))
}

function concatCss() {
    return src('app/css/**/*.min.css')
        .pipe(concat('style.min.css'))
        .pipe(dest('app/css'))
}

/////////////////////////////////////////////

function watching() {
    watch(['app/scss/**/*.scss'], styles);
    watch(['app/js/**/*.js', '!app/js/main.min.js'], scripts);
    watch('app/*html').on('change', browserSync.reload);
    watch(['app/pages/**/*.njk'], html)
}

function browsersync() {
    browserSync.init({
        server: {
            baseDir: './app'
        }
    });
}

function scripts() {
    return src([
        'node_modules/jquery/dist/jquery.js',
        'app/js/main.js'
    ])
        .pipe(sourcemaps.init())
        .pipe(jshint())
        .pipe(babel({
            presets: ['@babel/env']
        }))
        .pipe(uglify())
        .pipe(concat('main.min.js'))
        .pipe(sourcemaps.write('.'))
        .pipe(dest('app/js'))
        .pipe(browserSync.stream());
}

function scriptBuild() {
    return src('app/js/main.js')
        .pipe(jshint())
        .pipe(babel({
            presets: ['@babel/env']
        }))
        .pipe(uglify())
        .pipe(concat('main.min.js'))
        .pipe(dest('app/js'))
}

function build() {
    return src([
        'app/css/style.min.css',
        'app/fonts/build/**/*',
        'app/js/main.min.js',
        'app/**/*.html',
    ], { base: 'app' })

        .pipe(dest('dist'))
}

function cleanDist() {
    return del('dist')
}

function cleanApp() {
    return del(['app/fonts/build', 'app/images/all_images'])
}

function images() {
    return src('app/images/all_images/**/*')
        .pipe(webp({
            quality: 70
        }))
        .pipe(imagemin(
            [
                imagemin.gifsicle({ interlaced: true }),
                imagemin.mozjpeg({ quality: 75, progressive: true }),
                imagemin.optipng({ optimizationLevel: 5 }),
                imagemin.svgo({
                    plugins: [
                        { removeViewBox: true },
                        { cleanupIDs: false }
                    ]
                })
            ]))
        .pipe(dest('dist/images'))
}

function IconToConvert() {
    return src('app/images/icon/*.svg')
        .pipe(svg2png())
        .pipe(dest('app/images/all_images/icon_convert/'));
}


////////////////////////////////////////////////////////
function workCleanProcces() {
    return src('app/fonts/scss/*.scss')
        .pipe(rename('_icons.scss'))
        .pipe(dest('app/scss/'))

}

function workCleanProccesDell() {
    return del('app/fonts/scss', '!app/fonts/')
}

function workCleanProccesDell2() {
    return del('app/fonts/icons', '!app/fonts/')
}
///////////////////////////////////////////////////////////
function MaketDef() {
    return del('app/fonts/*', '!app/fonts/')
}
function MaketDef2() {
    return del('app/images/icon/*', '!app/fonts/')
}




exports.workCleanProccesDell = workCleanProccesDell;
exports.workCleanProcces = workCleanProcces;
exports.scriptBuild = scriptBuild;
exports.iconFontCss = iconFontCss;
exports.cleanApp = cleanApp;
exports.Fonts = Fonts;
exports.webpHtml = webpHtml;
exports.concatCss = concatCss;
exports.IconToConvert = IconToConvert;
exports.styles = styles;
exports.StyleWebp = StyleWebp;
exports.watching = watching;
exports.scripts = scripts;
exports.images = images;
exports.cleanDist = cleanDist;
exports.html = html;

//! wkp - workCleanProcces1
// Очистить рабочее пространство после конвертации иконок 
exports.wkp = series(workCleanProcces, workCleanProccesDell, workCleanProccesDell2);
//! MaketDefault
// Сбросить макет к дефолтным настройкам
exports.Md = series(MaketDef, MaketDef2);
// !production
// Сбилдить готовый проект
exports.build = series(cleanDist, Fonts, webpHtml, scriptBuild, IconToConvert, images, StyleWebp, concatCss, build, cleanApp);
// !development
// Стандартный запуск галп
exports.default = parallel(html, styles, scripts, browsersync, watching);
// Сгенерировать иконочный шрифт
exports.icon = parallel(iconFontCss)



Ответы (0 шт):