如何为 nunjucks 设置 baseurl

Question

我想将站点部署到不同的服务器以进行测试、生产等。因此，通过更改一个变量或设置来定义基本路径将是首选方法。实现它的最佳方法是什么？

目前我在布局文件中设置了一个变量如下。

{% set siteBaseurl = '/demo' %}

其他地方都用到我定义的路径如下

<img src="{{ siteBaseurl }}/images/logo.png" />

Answer 1

我找到了完美的解决方案。如 gulp-nunjucks-render 包中所述，您可以通过 gulp 任务将变量解析为模板。使用 dotenv，您可以从单个配置文件中获取它。这是我的设置方式

.env

NODE_ENV=development
BASEURL=\demo

gulpfile.js

const nunjucksData = {
    baseurl: process.env.BASEURL
};

gulp.task('nunjucks', function () {
    nunjucksRender.nunjucks.configure(['app/templates/']);
    // Gets .html and .nunjucks files in pages
    return gulp.src('app/pages/**/*.+(html|njk|nunj|nunjucks)')
        // Renders template with nunjucks
        .pipe(nunjucksRender({
            data: nunjucksData,
            path: ['app/templates/'] // String or Array
        }))
        .pipe(gulpif(isProd, htmlmin()))
        // output files in app folder
        .pipe(gulp.dest('dist'));
});

layout.njk

<img src="{{ baseurl }}/images/logo.png" />

希望对您有所帮助

如何为 nunjucks 设置 baseurl

How to setup the baseurl for nunjucks

npm

nunjucks

gulp

gulp-nunjucks-render