panini

Panini

Generator file datar super sederhana untuk digunakan dengan Gulp. Ini mengkompilasi serangkaian halaman HTML menggunakan tata letak umum. Halaman -halaman ini juga dapat mencakup parsial HTML, pembantu setang eksternal, atau data eksternal sebagai JSON atau YAML.

Panini bukan generator situs statis penuh-bukan, ia memecahkan masalah yang sangat spesifik untuk merakit file datar dari elemen umum, menggunakan bahasa templating.

Instalasi

npm install panini --save-dev

Penggunaan

Feed Panini aliran file HTML, dan dapatkan situs yang rata yang lezat dari ujung lainnya.

 var gulp = require ( 'gulp' ) ;
var panini = require ( 'panini' ) ;

gulp . task ( 'default' , function ( ) {
  gulp . src ( 'pages/**/*.html' )
    . pipe ( panini ( {
      root : 'pages/' ,
      layouts : 'layouts/' ,
      partials : 'partials/' ,
      helpers : 'helpers/' ,
      data : 'data/'
    } ) )
    . pipe ( gulp . dest ( 'build' ) ) ;
} ) ;

Perhatikan bahwa Panini memuat tata letak, parsial, pembantu, dan file data setelah dijalankan pertama kali. Setiap kali file -file ini berubah, hubungi panini.refresh() untuk mendapatkan informasi terbaru. Anda dapat dengan mudah melakukan ini di dalam panggilan ke gulp.watch() :

 gulp . watch ( [ './src/{layouts,partials,helpers,data}/**/*' ] , [ panini . refresh ] ) ; 

Opsi

root

Ketik: String

Jalur ke folder root Semua halaman tinggal. Opsi ini tidak menarik file sendiri untuk diproses - gulp.src() gunanya. Pengaturan ini memberi tahu Panini apa akar umum dari halaman situs Anda.

layouts

Ketik: String

Jalur ke folder yang berisi tata letak. File tata letak dapat memiliki ekstensi .html , .hbs , atau .handlebars . Satu tata letak harus dinamai default . Untuk menggunakan tata letak selain default pada halaman tertentu, angkanya dalam materi depan pada halaman itu.

---
layout: post
---

<!-- Uses layouts/post.html as the template -->

Semua tata letak memiliki setang khusus sebagian yang disebut body yang berisi isi halaman.

 <!-- Header up here -->
{{ > body}}
<!-- Footer down here -->

pageLayouts

Jenis: Object

Daftar preset untuk tata letak halaman, dikelompokkan berdasarkan folder. Ini memungkinkan Anda untuk secara otomatis mengatur semua halaman dalam folder tertentu untuk memiliki tata letak yang sama.

 panini ( {
  root : 'src/pages/' ,
  layouts : 'src/layouts/' ,
  pageLayouts : {
    // All pages inside src/pages/blog will use the blog.html layout
    'blog' : 'blog'
  }
} )

partials

Ketik: String

Jalur ke folder yang berisi parsial HTML. File parsial dapat memiliki ekstensi .html , .hbs , atau .handlebars . Masing -masing akan didaftarkan sebagai parsial setang yang dapat diakses menggunakan nama file. (Jalur ke file tidak masalah - hanya nama file itu sendiri digunakan.)

 <!-- Renders partials/header.html -->
{{ > header}}

helpers

Ketik: String

Jalur ke folder yang berisi handsang setang. Pembantu Setang adalah file .js yang mengekspor fungsi melalui module.exports . Nama yang digunakan untuk mendaftarkan helper sama dengan nama file.

Misalnya, file bernama markdown.js yang mengekspor fungsi ini akan menambahkan helper setang yang disebut {{markdown}} .

 var marked = require ( 'marked' ) ;

module . exports = function ( text ) {
  return marked ( text ) ;
}

data

Ketik: String

Jalur ke folder yang berisi data eksternal, yang akan diteruskan ke setiap halaman. Data dapat diformat sebagai JSON ( .json ) atau YAML ( .yml ). Dalam templat, data disimpan dalam variabel dengan nama yang sama dengan file itu berasal.

Misalnya, file bernama contact.json dengan pasangan kunci/nilai seperti berikut:

 {
    "name" : "John Doe" ,
    "email" : "[email protected]" ,
    "phone" : "555-1212"
}

Dapat digunakan untuk mengeluarkan nilai John DOE dalam templat menggunakan sintaks setang {{contact.name}} .

Data juga dapat berupa file .js dengan module.exports . Data yang dikembalikan oleh fungsi ekspor akan digunakan.

Data juga dapat dimasukkan ke dalam halaman itu sendiri dengan templat materi depan di bagian atas file.

Terakhir, variabel page yang dipesan ditambahkan ke setiap templat halaman saat diterjemahkan. Ini berisi nama halaman yang diberikan, tanpa ekstensi.

Cli

Anda juga dapat menggunakan Panini melalui CLI.

 Usage: panini --layouts=[layoutdir] --root=[rootdir] --output=[destdir] [other options] 'pagesglob'

Options:
  --layouts  (required) path to a folder containing layouts
  --root     (required) path to the root folder all pages live in
  --output     (required) path to the folder compiled pages should get sent to
  --partials            path to root folder for partials
  --helpers             path to folder for additional helpers
  --data                path to folder for additional data

the argument pagesglob should be a glob describing what pages you want to apply panini to.

Example: panini --root=src/pages --layouts=src/layouts --partials=src/partials --data=src/data --output=dist 'src/pages/**/*.html'

Pengembangan Lokal

git clone https://github.com/foundation/panini
cd panini
npm install

Gunakan npm test untuk menjalankan tes.