为GitHub页面设置Jekyll环境

Question

我正在使用Jekyll建立一个我在GitHub页面上托管的网站.我希望能够JEKYLL_ENV=production在部署到GitHub页面时将JEKYLL_ENV设置为'production'(),这样我就能做到这样的事情:

{% if jekyll.environment == "production" %}
{% include googleAnalytics.html %}
{% endif %}

和

{% if jekyll.environment == "production" %}
    <link rel="stylesheet" href="/assets/css/main.min.css">
{% else %}
    <link rel="stylesheet" href="/assets/css/main.css">
{% endif %}

现在,我已经读过GitHub Pages应该自动设置JEKYLL_ENV为production,但当我{{ jekyll.enviornment }}进入我的页面时,我会development在本地和我的托管网站上获得.在使用this和this部署之前,这可能与我构建站点有关.

我的gulpfile.js

var gulp        = require('gulp');
var ghPages     = require('gulp-gh-pages');
var browserSync = require('browser-sync');
var sass        = require('gulp-sass');
var prefix      = require('gulp-autoprefixer');
var minifyCss   = require('gulp-minify-css');
var rename      = require('gulp-rename');
var cp          = require('child_process');

...

/**
 * Build the Jekyll Site
 */
gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build'], {stdio: 'inherit'})
        .on('close', done);
});

...

/**
 * Deploy to gh-pages
 */
gulp.task('deploy', ['jekyll-build'], function() {
    return gulp.src('./_site/**/*')
        .pipe(ghPages());
});

基本上,当我运行时gulp deploy,我将_site目录并将其推送到gh-pages分支.

我不知道这是否导致环境被设置为development或者是什么,但我想要做的不是在jekyll-build任务中运行deploy任务而是创建并运行jekyll-build-prod设置JEKYLL_ENVto 的新任务production.

这是我遇到的问题.我不确定如何设置环境child_process spawns(它已经写在这个样板文件中).我看过这个命令推荐:$ JEKYLL_ENV=production jekyll build.我似乎只是需要改变我的jekyll-build任务来融入它.

如果有一种更简单的方法,我很乐意听到它.

任何帮助表示赞赏.

编辑:

我已尝试将_config.yml我设置的位置environment: prod和_config_dev.yml我设置的位置environment: dev以及更新我的gulp任务包括在内:

/**
 * Build the Jekyll Site
 */
gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build', '--config', '_config.yml,_config_dev.yml'], {stdio: 'inherit'})
        .on('close', done);
});

/**
 * Build the Jekyll Site for production
 */
gulp.task('jekyll-build-prod', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build', '--config', '_config.yml'], {stdio: 'inherit'})
        .on('close', done);
});

但是,当我运行部署任务并检查托管网站时,它仍然说environment是development.

即使我包括environment: prod在这两个_config.yml和_config_dev.yml,还在说development.

Answer 1

我不使用GitHub的网页自己...但是据我所知,GitHub的页面设置JEKYLL_ENV到production 当你把你的源代码,GitHub上,让GitHub的网页建立网站.

您正在做一些不同的事情:您在本地构建您的站点并且只是推送完成的HTML文件(_site文件夹),因此GitHub Pages将永远不会实际构建您的站点.

这意味着你需要照顾的切换development和production当你建立你的网站在本地自己.
最简单的方法是使用两个单独的配置文件,就像我在这个答案中解释的那样.

Answer 2

经过多次尝试和错误，我终于找到了解决这个问题的方法。无论出于何种原因，@Christian Specht 提供的答案（使用两个不同的配置文件不起作用）。相反，我必须使用child process spawns我的 gulp 任务手动更改环境。我的更新gulpfile.js：

/**
 * Build the Jekyll Site
 */
gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build'], { stdio: 'inherit' })
        .on('close', done);
});

/**
 * Build the Jekyll Site for production
 */
gulp.task('jekyll-build-prod', function (done) {
    browserSync.notify(messages.jekyllBuild);

    var productionEnv = process.env;
    productionEnv.JEKYLL_ENV = 'production';

    return cp.spawn('jekyll', ['build'], { stdio: 'inherit' , env:productionEnv })
        .on('close', done);
});

/**
 * Deploy to gh-pages
 */
gulp.task('deploy', ['jekyll-build-prod'], function() {
    return gulp.src('./_site/**/*')
        .pipe(ghPages());
});