javascript - programacion - ¿Cómo cargar múltiples archivos JSON en plantillas de Jade usando Grunt?

pug preprocesador html

Question

Puedo cargar con éxito un archivo JSON como fuente de datos para mis plantillas de Jade usando Grunt, similar a esta solución .

Ahora necesito cargar un conjunto de archivos JSON desde diferentes carpetas dentro de mi proyecto para que todos los datos de ellos sean accesibles desde las plantillas de Jade. ¿Cómo hacerlo mejor en el contexto de las tareas de Grunt?

Answer 1

Necesitas combinar los Objetos antes de servirlos a Jade. Para esto, recomendaría usar Underscore.js.

Personalmente, escribo un método para recuperar los datos de los archivos, como este:

module.exports = function(grunt) {

    function combineJSONFiles() {
        var object = {};

        for(var i=0; i<arguments.length; ++i) {
            _(object).extend(grunt.file.readJSON(arguments[i]));
        }

        return object;
    }

    grunt.loadNpmTasks(''grunt-contrib-jade'');

    grunt.initConfig(
    {
        jade: {
            html: {
                src: ''./*.jade'',
                dest: ''./index2.html'',
                options: {
                    client: false,
                    pretty: true,
                    data: combineJSONFiles(
                        "1.json",
                        "2.json",
                        "3.json"
                    )
                }
            }
        }
    });

    grunt.registerTask(''default'', ''jade'');
};

¡Espero que ayude!

Answer 2

Puede cargar tantos archivos JSON como desee con este método:

    // Jade => HTML
gruntConfig.jade = {
    compile: {
        options: {
            data: {
                object: grunt.file.readJSON(''JSON_FILE.json''),
                object1: grunt.file.readJSON(''JSON_FILE_1.json''),
                object2: grunt.file.readJSON(''JSON_FILE_2.json''),

            }
        },
    }
};

Y luego en la plantilla de Jade simplemente necesita hacer referencia al objeto. ES DECIR:

    script(src= object.baseURL + "js/vendor/jquery.js")
    script(src= object.baseURL + "js/vendor/elementQuery.js")
    script(data-main="js/main", src= object.baseURL + "js/vendor/require.js")

Sé que esto se está respondiendo un poco tarde, pero para cualquiera que se encuentre con esto desde una búsqueda en google como yo, esta es la respuesta para cargar varios archivos JSON en una plantilla de Jade usando Grunt.js.