Question

我正在使用gulp处理Web应用程序Angularjs。

使用gulp我创建了一个环境变量，如下面的

var env = process.env.NODE_ENV  || 'test';

gulp.task('preprocess', function() {
    log('Preprocess..');
    log(env)
    // Minify and copy all JavaScript (except vendor scripts)
    return gulp.src(source.scripts)
        .pipe(preprocess({context:{target:env}}))
});

这是我的gulp输出

[11:23:02] Starting 'preprocess'...
[11:23:02] Preprocess..
[11:23:02] test
[11:23:02] Finished 'preprocess' after 370 ms

但我无法在我的角度代码中访问此环境变量。我不知道需要包含任何插件吗？

这是访问环境变量

的js代码

//@ifdef  env='test'
    alert('Environment variable test');
//@endif

//@ifdef  env='local'
alert('Environment variable local');
//@endif    

//@ifdef  env='dev'
alert('Environment variable dev');
//@endif

如何访问gulp创建的环境变量。

请帮帮我。

Answer 1

我假设您正在开发一个提供index.html的SPA。

如果是这样，那么使用服务器端HTML模板库来预处理HTML。我们个人正在使用玉。

你基本上将index.html转换为Jade - 给你index.jade。创建gulp任务以将Jade编写为HTML。在gulp任务中，您可以设置Jade用于编写index.html的变量。

在index.jade中执行类似......

的操作

<html class="VARIABLE_FROM_GULP_TASK"> <!-- this would be written in Jade -->

你的gulp任务会进行HTML转换

然后您可以检查JavaScript中是否存在类，或者在CSS中执行类似...

的操作

.var_exist .body { color:red }
.var_not_exist .body { color:blue }

请注意，变量的值将在构建时写入HTML文件。

希望有所帮助。

如何访问angularjs中的预处理

1 个答案: