开发环境中的 Grunt 美化或不丑化答案

【问题标题】：Grunt prettify or not uglify in development environment开发环境中的 Grunt 美化或不丑化
【发布时间】：2016-02-14 04:10:03
【问题描述】：

我在我的 AngularJS Web 应用程序中使用 Grunt Uglify 来对我的 javascript 和 css 文件进行 uglify。

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

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

【问题讨论】：

标签： angularjs node.js gruntjs

【解决方案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了解更多详情

【讨论】：