javascript - serve - instalar grunt en windows

cómo configurar grunt.js para minificar archivos por separado

Question

hay algunos archivos js en static / js /

 1. a.js
2. b.js
3. c.js 

cómo configurar grunt.js para obtener debajo de los archivos:

 1. a.min.js
2. b.min.js
3. c.min.js

hasta ahora, tengo que escribir el nombre de archivo específico:

 min: {
dist: {
src: ''js/**/*.js'',
dest: ''js/min/xxx.min.js''
}
}

Answer 1

También puedes usar copy y grunt-mindirect .

copy: {
dist: {
src: ''a.js'',
dest: ''a.min.js''
}
},
minidirect: {
all: ''js/min/*.min.js''
}

Esto debería funcionar.

Answer 2

De los documentos de ronco para min:

Esta tarea es una tarea múltiple, lo que significa que gruñido iterará automáticamente sobre todos los objetivos mínimos si no se especifica un objetivo.

Entonces puedes hacer esto:

 min: {
min_a: {
src: ''a.js'',
dest: ''a.min.js''
},
min_b: {
src: ''b.js'',
dest: ''b.min.js''
},
min_c: {
src: ''c.js'',
dest: ''c.min.js''
}

No hay nada especial sobre el nombre ''dist'' para estas tareas.

Answer 3

En grunt 0.4 puedes especificar múltiples pares de dest / src como este:

uglify: {
dist: {
files: {
''dist/main.js'': ''src/main.js'',
''dist/widget.js'': ''src/widget.js''
}
}
}

Answer 4

Supongo que solo importa para las tareas de vigilancia.

En ronco 0.4 puedes hacer esto

 var filesA = ''a.js'', filesB = ''b.js'', filesC = ''c.js'';
...
min: {
min_a: {
src: filesA,
dest: ''a.min.js''
},
min_b: {
src: filesB,
dest: ''b.min.js''
},
min_c: {
src: filesC,
dest: ''c.min.js''
}
watch: {
min_a: {
files: filesA,
tasks: [''min:min_a'']
},
min_b: {
files: filesB,
tasks: [''min:min_b'']
},
min_c: {
files: filesC,
tasks: [''min:min_c'']
}
}

Después de eso, solo comienza a grunt watch y todo estará bien automágicamente.

Answer 5

Tuve el mismo problema y encontré una solución que minería automáticamente todos mis scripts por separado:

uglify: {
build: {
files: [{
expand: true,
src: ''**/*.js'',
dest: ''build/scripts'',
cwd: ''app/scripts''
}]
}
}

Answer 6

O puede usar expandMapping, así:

min: {
files: grunt.file.expandMapping([''path/*.js'', ''path2/*.js''], ''destination/'', {
rename: function(destBase, destPath) {
return destBase+destPath.replace(''.js'', ''.min.js'');
}
})
}

Y el resultado:

path / test.js => destination / path / test.min.js
path2 / foo.js => destination / path2 / foo.min.js

Answer 7

Esto a continuación gruntjs me funciona para crear archivos minificados para todos los archivos js bajo un directorio

module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON(''package.json''),
uglify: {
build: {
files: [{
expand: true,
src: ''**/*.js'',
dest: ''build/scripts'',
cwd: ''public_html/app'',
ext: ''.min.js''
}]
}
}
});
// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks(''grunt-contrib-uglify'');
// Default task(s).
grunt.registerTask(''default'', [''uglify'']);
};

Answer 8

Me gusta guardar los archivos originales y también crear los uglified:

uglify: {
dist: {
files: [{
expand: true,
src: ''**/*.js'',
dest: ''destdir'',
cwd: ''srcdir'',
rename: function(dest, src) { return dest + ''/'' + src.replace(''.js'', ''.min.js''); }
}]
}
},

Answer 9

Use la opción ext para nombrar los archivos .min.js lugar de .js

uglify: {
build: {
files: [{
expand: true,
src: ''**/*.js'',
dest: ''build/scripts'',
cwd: ''app/scripts'',
ext: ''.min.js''
}]
}
}

Answer 10

Para exportar explícitamente algunos archivos a archivos de salida separados (en este caso all.min.js y all.jquery.js ) use:

uglify: {
js: {
files : {
''js/all.min.js'' : [
''js/modernizr.js'',
''js/vendor/modernizr-2.6.2-respond-1.1.0.min.js'',
''js/bootstrap.min.js'',
''js/main.js'',
''js/ZeroClipboard.min.js'',
''js/bootstrap-datepicker/bootstrap-datepicker.js''
],
''js/all.jquery.js'' : [
''js/vendor/jquery-1.9.1.js'',
''js/vendor/jquery-migrate-1.2.1.js'',
''js/vendor/jquery-ui.js''
]
}
},
options: {
banner: ''/n/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> *//n'',
preserveComments: ''some'',
report: ''min''
}
},

Answer 11

En una intención de ayudar a otros que vienen a esta página en el futuro -

Encontré un video que explica cómo minificar los archivos JS usando Grunt JS aquí: https://www.youtube.com/watch?v=Gkv7pA0PMJQ

El código fuente está disponible aquí: http://www.techcbt.com/Post/359/Grunt-JS/how-to-minify-uglify-javascript-files-using-grunt-js

Por si acaso, si los enlaces anteriores no funcionan:

1. Puede minificar todos los archivos javascript y combinar / concat en un archivo con el siguiente script:

 module.exports = function(grunt){
grunt.loadNpmTasks(''grunt-contrib-uglify'');
grunt.initConfig({
pkg: grunt.file.readJSON(''package.json''),
uglify:{
t1:{
files:{
''dest/all.min.js'': [''src/app.js'', ''src/one.js'', ''src/t/two.js'']
}
}
}
});
};

2. Si desea que también se generen mapas de origen, puede habilitar la opción "sourceMap" de la siguiente manera:

 module.exports = function(grunt){
grunt.loadNpmTasks(''grunt-contrib-uglify'');
grunt.initConfig({
pkg: grunt.file.readJSON(''package.json''),
uglify:{
t1:{
options : {
sourceMap : true,
},
files:{
''dest/all.min.js'': [''src/app.js'', ''src/one.js'', ''src/t/two.js'']
}
}
}
});
};

3. Para conservar toda la estructura de la carpeta al minificar los archivos JS, puede usar la siguiente secuencia de comandos:

 module.exports = function(grunt){
grunt.loadNpmTasks(''grunt-contrib-uglify'');
grunt.initConfig({
pkg: grunt.file.readJSON(''package.json''),
uglify:{
t1:{
files: [{
cwd: ''src/'',
src: ''**/*.js'',
dest: ''dest/'',
expand: true,
flatten: false,
ext: ''.min.js''
}]
}
}
});
};