AngularJS使用GruntJS的开发模式

Development mode for AngularJS using GruntJS

本文关键字:开发 模式 GruntJS 使用 AngularJS      更新时间:2023-09-26

我有几个产品是从yeoman角度生成器开始的,它是一个非常好的开发设置。有一件事我一直没能找到一个好的解决方案,那就是设置一个开发/生产模式标志。

很自然,我们使用了一些我们只想在生产中使用的工具,因此拥有可以同时使用内联JavaScript和/或HTML文件的prod/dev变量将非常有用。我以前在网上搜索过解决方案,但没有找到任何有用的东西。

最终,我正在寻找一个在AngularJS设置中使用的好解决方案,最好是通过grunt serve和/或build-run设置。其他球队在这里做什么?

我使用的是ng常量。它创建了一个.js文件,其中包含一些您选择的角度常数。

grunt.initConfig({
    ...
    ngconstant: {
        options: {
            name: 'config',
            dest: '<%= yeoman.app %>/scripts/config.js'
        },
        development: {
            constants: {
                myVariable: 'it is development'
            }
        },
        production: {
            constants: {
                myVariable: 'it is production'
            }
        }
    }
});

然后将其添加到您的任务中:

grunt.registerTask('serve', [
    ...
    'ngconstant:development',
    ...
]);

别忘了在你的html中包含这个/scripts/config.js文件,并将"config"注入你的应用程序。

var app = angular.module('myApp', [
    'config',
    ...
]);