Comment construire Twitter Bootstrap 3 utilisation de Grunt

J'ai cloné Twitter Bootstrap 3, l'utilisation de git clone https://github.com/twbs/bootstrap.git:

Maintenant, je suis en train de le construire à l'aide de Grognement et je ne trouve aucune documentation sur la façon de le faire.

Où dois-je commencer?

Peut-être que vous êtes à la recherche pour le instructions d'Installation dans le projet de pensions du README?

OriginalL'auteur TarDavis | 2014-01-26

  1. 3

    D'ajouter un peu plus d'automatisation de votre projet, je vous suggère est d'utiliser Bower. Ce sera même vous sauver le temps de téléchargement tout à votre actifs.

    Afin d'utiliser la Charmille vous avez besoin de verdure.json

    Ce fichier ressemble à ceci:

    {
    "name": "WebExpressive",
    "version": "0.0.0",
    "authors": [
        "username <[email protected]>"
    ],
    "description": "An awesome web application",
    "license": "MIT",
    "ignore": [],
    "dependencies": {
        "bootstrap": "latest",
        "jQuery": "latest",
        "angular-latest": "latest",
        "turnjs": "latest"
    }
}

    Maintenant, vous branchez votre de verdure à grunt, vous devez avoir une Gruntfile.js qui ressemble à quelque chose comme ceci

    module.exports = function (grunt) {
    //project configuration
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        shell: {
            multiple: {
                command: ['bower install',
                    'mv bower_components/** public/',
                    'rm -rf bower_components'].join('&&')
            }
        }
    });

    grunt.loadNpmTasks('grunt-shell');

    //Default Tasks
    grunt.registerTask('default', ['shell']);

    //production Tasks
    //grunt.registerTask('dist',[..]);

    //test tasks
};

    Maintenant, avant d'exécuter l' "grognement", assurez-vous que vous avez obtenu tous les mnp colis dans votre répertoire de projet et paquet.json est en bonne forme.

    Prendre un coup d'oeil à mon paquet.json fichier.

    {
    "name": "application-name",
    "version": "0.0.1",
    "private": true,
    "scripts": {
        "start": "node app.js"
    },
    "dependencies": {
        "grunt": "*",
        "grunt-shell": "*",
        "grunt-contrib-uglify": "*",
        "grunt-contrib-connect": "*",
        "grunt-contrib-coffee": "*",
        "grunt-contrib-compass": "*",
        "grunt-open": "*",
        "grunt-contrib-requirejs": "*",
        "grunt-contrib-jade": "*",
        "grunt-contrib-copy": "*",
        "grunt-bower-install": "*"
    }
}

    Maintenant, vous avez juste besoin d'exécuter ces commandes, et vous pouvez trouver la votre bootstrap à l'intérieur du dossier public.

    npm install
grunt

    Veuillez visiter grunt et grunt shell à explorer davantage sur ce, ils sont tout simplement génial.

    cela semble être beaucoup de code que j'aurais à écrire pour télécharger simple des fichiers css pour faire un simple site html css
    Mais pensez à la simplicité. Vous venez de donner à quelqu'un le package.json et Gruntfile.js et il sera en mesure de mettre en place tout simplement en exécutant quelques commandes. Mais je suis d'accord avec vous, nous passer quelque temps sur l'écriture de Gruntfile.js et au début cela parait fastidieux, mais une fois que le projet se développe, il est très utile, en particulier lorsqu'un nouveau développeur rejoint l'équipe, il peut rapidement mis en place tout.

    OriginalL'auteur NarendraSoni

  2. 2

    Pour un enseignement de base sur la façon de construire à l'aide de Grunt vous pouvez vous référer à

    http://getbootstrap.com/getting-started/

    Essentiellement, c'est aussi facile que de 

    grunt dist

    Si vous exécutez à partir de la ligne de commande dans Windows, assurez-vous d'exécuter cmd.exe en tant qu'administrateur.

    OriginalL'auteur Alexidze