babel-plugin-nunjucks/README.md

2.0 KiB
Raw Blame History

babel-plugin-nunjucks

Плагин для babel-loader, позволяющий использовать шаблонизатор Nunjucks внутри JS-файлов.

Установка

yarn add -D @advdominion/babel-plugin-nunjucks

Использование

Используются Tagged templates с тегом njk:

njk`
    {% from "./item.njk" import item as item %}

    <div class="items">
		{% for n in range(0, 10) %}
			{{item()}}
		{% endfor %}
    </div>
`;

Пример конфигурации Webpack:

[
    {
        test: /\.js$/,
        exclude: [/mocks\.js$/],
        use: [
            {
                loader: 'babel-loader',
                options: {
                    cacheDirectory: true,
                },
            },
        ],
    },
    {
        test: /mocks\.js$/,
        use: [
            {
                loader: 'babel-loader',
                options: {
                    compact: false,
                    plugins: [
                        [
                            '@advdominion/babel-plugin-nunjucks',
                            {
                                templatesFolder: 'src/templates/',
                            },
                        ],
                    ],
                },
            },
        ],
    },
];

Опции

  • templatesFolder - строка, обязательный параметр. Путь до папки с файлами шаблонов
  • globals - массив, необязательный параметр. Глобальные переменные для Nunjucks (например, [{name: "message", value: "Hello, world!"}])

Важно: Параметр cacheDirectory в опциях babel-loader должен быть отключён.