4

grunt-contrib-uglify プラグインを使用して、JavaScript ソース ファイルを本番用に圧縮しています。

この問題は、chrome の dev-tools (または firefox の) で関数をデバッグしようとすると発生します。

Gruntfile.js の uglify タスク構成で mangle:true (デフォルト値) を設定し、uglifyjs は、生成されたコードの変数名を mangles (短縮および名前変更) します。

これらの変数は、元のローカル変数名に正しくマップされていません。そのため、デバッグは非常に苦痛です。

これを修正するためのアイデアはありますか?

以下は私のGruntfile.jsです

/* global module */

module.exports = function (grunt) {

    grunt.initConfig({
        copy: {
            production: {
                files: [
                    {
                        expand: true,
                        cwd: "./development/js/",
                        src: "./*",
                        dest: "./production/js/debug/"
                    }
                ]
            }
        },

        uglify: {
            production: {
                options: {
                    sourceMap: true
                    /* mangle: false */
                },

                files: {
                    "./production/js/one.min.js": ["./development/js/one.js"],
                    "./production/js/two.min.js": ["./development/js/two.js"]
                    //"./production/js/app.js": ["./development/js/one.js" , "./development/js/two.js" ]
                }
            }
        }
    });

    // [STEP] Load required GRUNT plugins
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-uglify');

    // [STEP] Register tasks
    grunt.registerTask("default", ["copy:production", "uglify:production"]);
};

私のディレクトリ構造は基本的に、

Project ROOT dir

--F-- package.json
--F-- Gruntfile.json

--D-- node_modules
--*---- * (module files folders)

--D-- development
--D---- js
--F------ one.js
--F------ two.js

--D-- production
--D---- js (generated from grunt)
--*------ * (generated files)
--D------ debug (generated from grunt)
--*-------- * (generated files)
--F---- index.html
4

1 に答える 1