SORU
4 Aralık 2012, Salı


Nasıl ve grunt.js (0.3.birden fazla CSS ve JavaScript dosyalarını minify için x)

Not: Bu soru Homurtu ilgili sadece 0.3.x ve başvuru için bırakıldı. En son Homurtu ile yardım 0.4 için.x sürümü, bu soru altında benim yorum bakın.

Şu anda ilk bitiştirmek için otomatik yapılandırma sürecinde kur ve sonra CSS ve JavaScript dosyaları için küçültmeye grunt.js kullanmaya çalışıyorum.

Her zaman sadece onları üzerine yerine dosyaya eklemek gibi görünüyor homurtu işletiyorum rağmen başarılı bir şekilde ve benim JavaScript dosyalarını minify etmek mümkün olmuştur.

Küçültmeye ve hatta bitiştirmek CSS, henüz bunu yapmak için geçiremedi!

Homurtu CSS modülleri açısındanconsolidate-css, ** & cssmin 9 kullanma ama boşuna denedim. Bunları kullanmak için nasıl kafamı değil!

Benim dizin yapısı aşağıdaki gibidir (tipik node.js bir uygulama olarak):

  • app.js
  • grunt.js
  • /public/index.html
  • /public/css/[çeşitli css dosyaları]
  • /public/js/[çeşitli javascript dosyaları]

Grunt.js benim dosya şu anda benim gibi uygulama kök klasöründe görünür:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: '<json:package.json>',
    concat: {
      dist: {
        src: 'public/js/*.js',
        dest: 'public/js/concat.js'
      }
    },
    min: {
      dist: {
        src: 'public/js/concat.js',
        dest: 'public/js/concat.min.js'
      }
    },
    jshint: {
      options: {
        curly: true,
        eqeqeq: true,
        immed: true,
        latedef: true,
        newcap: true,
        noarg: true,
        sub: true,
        undef: true,
        boss: true,
        eqnull: true,
        node: true
      },
      globals: {
        exports: true,
        module: false
      }
    },
    uglify: {}
  });

  // Default task.
  grunt.registerTask('default', 'concat min');

};

Sadece özetlemek için iki soru ile yardıma ihtiyacım var:

  1. Ve bir dosya klasörü /public/css/ altındaki tüm css dosyalarını minify nasıl, main.min.css söylüyorlar
  2. Neden grunt.js grunt çalıştığı birleştirilmiş ve minified javascript dosyaları için ekleme onları her zaman üzerine yerine concat.js /public/js/ altında concat.min.js devam ediyor mu?

Güncelleme 20 Haziran 2013 - Grunt 0.3 Yükseltme.x 0.4 sesleri çıkarmak.x

Grunt.js Grunt 0.4.x yeni bir yapı (dosya şimdi Gruntfile.js denir) taşındı. Benim açık kaynak Grunt 0.4.x inşa süreci ayarlama ile yardımcı olmak için Grunt.js Skeleton proje bakın.

CEVAP
6 Aralık 2012, PERŞEMBE


concat.js concat görevin kaynağı dahil ediliyor dosyaları public/js/*.js. Senin görevin kaldırır concat.js (eğer dosya var) daha önce bitiştirmek tekrar geçmek için bir dizi tanımlamanın hangi dosyaları istediğiniz için bir arada ve onların emri veya değişikliği yapı projesi.

Eğer ikincisi yapmak, ./src ./dest kapsamında inşa dosyalarınızı altında tüm kaynakları koyabilirsiniz

src
├── css
│   ├── 1.css
│   ├── 2.css
│   └── 3.css
└── js
    ├── 1.js
    ├── 2.js
    └── 3.js

Kurmak sonraherhangi bir parametregörev

concat: {
  js: {
    src: 'src/js/*.js',
    dest: 'dest/js/concat.js'
  },
  css: {
    src: 'src/css/*.css',
    dest: 'dest/css/concat.css'
  }
},

Seninmingörev

min: {
  js: {
    src: 'dest/js/concat.js',
    dest: 'dest/js/concat.min.js'
  }
},

-Buildmingörev yerine ihtiyacınız kadar UglifyJS kullanır. Buldumgrunt-cssçok iyi olmak. Yüklemeden sonra, homurtu dosyası yüklenemedi

grunt.loadNpmTasks('grunt-css');

Ve o zaman kurmak

cssmin: {
  css:{
    src: 'dest/css/concat.css',
    dest: 'dest/css/concat.min.css'
  }
}

Kullanımı-dahili min benzer olduğuna dikkat edin.

default görev değişikliği

grunt.registerTask('default', 'concat min cssmin');

Şimdi, grunt çalışan istediğiniz sonuçları üretecek.

dest
├── css
│   ├── concat.css
│   └── concat.min.css
└── js
    ├── concat.js
    └── concat.min.js

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • kamaniusilelis

    kamaniusilel

    10 HAZİRAN 2011
  • LounaTutorials

    LounaTutoria

    10 EYLÜL 2009
  • max2sims2

    max2sims2

    19 Kasım 2008