如何在 angularjs 中访问预处理

How to access preprocess in angularjs

本文关键字：访问 预处理 angularjs      更新时间：2023-09-26

我正在开发带有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}}))
});

这是我的吞咽输出

[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 创建的环境变量。

请帮助我。

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

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

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

在你的索引中，翡翠做一些类似的事情...

<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 文件中。

希望有帮助。

相关文章：