angularjs - Grunt 在开发环境中美化或不丑化

Question

我在 AngularJS Web 应用程序中使用 Grunt Uglify 来丑化我的 javascript 和 css 文件。

我有开发、测试和生产环境。我只想在部署到测试和生产时使用 uglify，但在开发过程中我希望保留我的代码而不使用 uglify，以使调试任务更容易。

到目前为止，我都是手动进行的。我的意思是，我有一个包含所有美观代码的index.html，当我要部署一个版本时，我会丑化代码并进行部署。

Answer 1

使用grunt.registerTask函数创建一个任务来运行开发中的任务，并创建另一个任务来在部署之前运行任务。

这是一个例子:

在开发环境中，我正在运行 buildDev 任务来编译 scss 文件并将它们链接到模板文件

module.exports = function(grunt) {
    grunt.registerTask('buildDev', [
        'sass:website',
        'asset-linker:websiteCSS',
        'asset-linker:websiteJS',
    ]);
};

在 prod 中部署应用程序之前，我运行 buildProd 任务来运行其他任务，例如 concat、cssmin、uglify :

module.exports = function(grunt) {
    grunt.registerTask('buildProd', [
        'clean:websiteStatic',
        'sass:website',
        'concat:websiteCSS',
        'concat:websiteJS',
        'cssmin:website',
        'uglify:website',
        'asset-linker:prodWebsiteCSS',
        'asset-linker:prodWebsiteJS',
    ]);
};

然后，创建两个注册任务，一个在您的开发环境中运行任务，另一个在部署您的应用程序之前。

我建议您阅读Grunt Documentation - register task了解更多详情