web-dev-qa-db-ja.com

UglifyJSでフォルダー内の複数のJavascriptファイルを縮小する方法は？

こんにちは私はuglifyJsを使用してjavascriptファイルを縮小していますが、一度に1つのファイルでうまく機能しています、私が望んでいるのはJSと呼ばれるフォルダにあるすべてのjavascriptファイルをJSMと呼ばれるフォルダに縮小することですtest1.jsとtest2.jsというJSフォルダー内に2つのファイルがあり、そのフォルダーに対してuglifyを実行し、JSMフォルダー内にtest1.min.jsとtest2.min.jsを生成したいので、実行する方法がありますこの？次のようなコマンド：

uglifyjs -c -m JS/*.js JSM/*.min.js

または私を助けることができる任意のアイデア。

ありがとう。

node.jsuglifyjsuglifyjs2
42
OussamaLord

大きなステップのように思えるかもしれませんが、 grunt の使用をお勧めします。慣れれば、本当に簡単です。

クラッシュコースは次のとおりです。

  1. インストール NodeJS

  2. Grunt CLIをインストールします（コンソール/ターミナルでこれを入力するだけです）：

     npm install -g grunt-cli

  3. 単純なpackage.jsonファイルをプロジェクトのルートに：

     {
 "name"： "my-project-name"、
 "version"： "1.0.0"、
 "devDependencies"：{
 "grunt"： "〜0.4.2"、
 "grunt-contrib-uglify"： "〜0.2.4"、
 "grunt-contrib-watch"： "〜0.5 .3 "
} 
}

  4. それができたら、次のように入力します：npm installをコンソールに（プロジェクトのルートに）。これにより、必要なgruntプラグイン/依存関係がインストールされます（上記のパッケージファイルから）。

  5. シンプルなgruntfile.jsプロジェクトのルートで（プロジェクトの一種の設定です）：

     module.exports = function（grunt）{
 grunt.initConfig（{
 

        // define source files and their destinations
    uglify: {
        files: { 
            src: 'js/*.js',  // source files mask
            dest: 'jsm/',    // destination folder
            expand: true,    // allow dynamic building
            flatten: true,   // remove all unnecessary nesting
            ext: '.min.js'   // replace .js to .min.js
        }
    },
    watch: {
        js:  { files: 'js/*.js', tasks: [ 'uglify' ] },
    }
});

// load plugins
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-uglify');

// register at least this one task
grunt.registerTask('default', [ 'uglify' ]);

     
};

  6. それが完了したら、それを構築するだけです。コンソールに入力します。

    うなり声

    または-より良い-以下のコマンドを実行すると、gruntはソースファイルの変更を監視し、それらのいずれかを変更すると、自動的にビルドします。

    うなり声を上げる--force

その後、次のようなプラグインを追加できます。cssミニファイ、cssプリプロセッサ（less、sass、スタイラス）、jshintなど。

84
tborychowski

Linux/Macを使用していて、bashにアクセスできる場合、次のように複数のJSファイルでuglifyjsを使用できます。

rm *.min.js; for f in *.js; do short=${f%.js}; uglifyjs $f > $short.min.js; done
18
Calpau

上記の答えに加えて、.bashrcファイルに次のように設定しました。

alias minify='rm *.min.js; for f in *.js; do short=${f%.js}; uglifyjs $f > $short.min.js; done'
8
mmorrey

npmのみの方法：

  1. 実行：

    npm install uglifyjs-folder --save-dev

  2. その後、package.json 何かのようなもの：

    "uglifyjs": "uglifyjs-folder js -eo jsm"

  3. 次に実行します：

     npm run uglifyjs

ソースファイル（js）と同じフォルダーに生成する必要がある場合は、次の作業を行う必要があります。

  1. 実行：

    npm install del-cli uglifyjs-folder --save-dev

  2. その後、package.json 何かのようなもの：

    "uglifyjs": "del js/*.min.js; uglifyjs-folder js -eo js"

  3. 次に実行します：

     npm run uglifyjs
6
Peter Butkovic

Gruntfile.jsでこの構成を使用できます。

uglify: {
        all: {
            files: [{
                expand: true,
                cwd: '<path to js folder>',
                src: ['**/*.js', '!*.min.js'],
                dest: '<path to js folder>',
                ext: '.js'
            }]
        }
    }
2
Kop4lyf

各行の先頭から始まるbatファイルを作成します

start uglifyjs app\main.js -mt sort -c -e -o app\main.ug.js
start uglifyjs app\lib.js -mt sort -c -e -r myfunctionname -o app\lib.ug.js
start uglifyjs app\controllers\bbbCtrl.js -mt sort -c  -o     app\controllers\bbbCtrl.ug.js
start uglifyjs app\controllers\aaaCtrl.js -mt sort -c -e -o app\controllers\aaaCtrl.ug.js
0
Fabio