Cómo minificar múltiples archivos Javascript en una carpeta con UglifyJS?

Question

Cómo minificar múltiples archivos Javascript en una carpeta con UglifyJS?

Hola estoy usando UglifyJS para minificar mis archivos javascript, está funcionando bien con un archivo a la vez, lo que estoy buscando es minificar todos los archivos javascript presentes en una carpeta llamada JS en una carpeta llamada JSM, para que quede claro que tengo 2 archivos dentro de mi carpeta JS llamada test1.js y test2.js y yo queremos ejecutar uglify contra esa carpeta y generar test1.min.js y test2.min.js dentro de la carpeta JSM, ¿hay alguna manera de hacer esto? un comando como :

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

O cualquier idea que pueda Ayúdame.

Gracias.

40

node.js uglifyjs uglifyjs2

Author: raina77ow, 2013-06-09

Source

6 answers

Si estás en Linux / Mac y tienes acceso a bash, puedes usar uglifyjs en varios archivos JS como así:

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

17

Author: Caleb Paul,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-04-25 11:54:20

Además de la respuesta anterior, ahora tengo esto establecido en mi .archivo bashrc:

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

8

Author: mmorrey,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-04-25 11:53:49

Npm-solo camino:

Ejecutar:
```
npm install uglifyjs-folder --save-dev
```
Y después añadir a su package.json algo como:
```
"uglifyjs": "uglifyjs-folder js -eo jsm"
```
Luego ejecuta:
```
 npm run uglifyjs
```

Tenga en cuenta que si necesita generar en la misma carpeta que los archivos fuente (js), lo siguiente debería hacer el trabajo:

Ejecutar:

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

Y después añadir a su package.json algo como:

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

Entonces ejecutar:
```
 npm run uglifyjs
```

6

Author: Peter Butkovic,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-12-30 22:55:13

Puede usar esta configuración en gruntfile.js:

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

2

Author: Kop4lyf,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-10-31 08:53:25

Hacer un archivo bat con inicio en cada fila comenzando

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

Author: Fabio,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-02-19 15:41:38

score 81 · Accepted Answer

Sé que puede parecer un gran paso, pero realmente recomendaría usar grunt . Es muy simple una vez que te acostumbras.

Aquí hay un curso intensivo:

Instalar NodeJS
Instalar Grunt CLI (simplemente ingrese esto en la consola/terminal):
```
npm install -g grunt-cli
```

Crea un simple archivo package.json en la raíz de tu proyecto:

{
  "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"
  }
}

Una vez que tenga eso, simplemente escriba: npm install en la consola (en la raíz de su proyecto). Esto instalará los plugins/dependencias grunt necesarios (del archivo de paquete anterior).

Ahora crea un gruntfile.js simple en la raíz de tu proyecto (es una especie de configuración para tu proyecto):

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' ]);


};

Una vez hecho esto, solo tiene que construirlo. Escriba en la consola:
```
grunt
```
O-mejor-si escribe ejecutar el comando a continuación-grunt monitoreará sus archivos de origen para los cambios, y si cambia cualquiera de ellos-se construirá ellos automáticamente:
```
grunt watch --force
```

Luego puede agregar más complementos, como: minificación css, preprocesadores css (less, sass, stylus), jshint, etc.