All Projects → posthtml → gulp-posthtml

posthtml / gulp-posthtml

Licence: other
PostHTML for Gulp

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Projects that are alternatives of or similar to gulp-posthtml

posthtml-mso
Makes writing Outlook conditionals in HTML emails easy.
Stars: ✭ 17 (-5.56%)
Mutual labels:  posthtml
emitty
A platform for finding dependencies between files and building tools for incremental compilation or build.
Stars: ✭ 69 (+283.33%)
Mutual labels:  posthtml
posthtml-css-modules
Use CSS modules in HTML
Stars: ✭ 54 (+200%)
Mutual labels:  posthtml
sass-starter-pack
Sass starter files using Gulp v4.0.0 🔥
Stars: ✭ 34 (+88.89%)
Mutual labels:  gulpfile
BBob
⚡️Blazing-fast js-bbcode-parser, bbcode js, that transforms and parses to AST with plugin support in pure javascript, no dependencies
Stars: ✭ 133 (+638.89%)
Mutual labels:  posthtml
magento2-gulpfile
Simple Gulpfile for Magento2
Stars: ✭ 16 (-11.11%)
Mutual labels:  gulpfile
Qmui web
An efficient front-end framework for developers building UI on the web.
Stars: ✭ 1,719 (+9450%)
Mutual labels:  gulpfile
Gulp-Beginners-Guide
Gulp 基本教學 - 從無到有 Gulp-Beginners-Guide
Stars: ✭ 29 (+61.11%)
Mutual labels:  gulpfile
Posthtml
PostHTML is a tool to transform HTML/XML with JS plugins
Stars: ✭ 2,737 (+15105.56%)
Mutual labels:  posthtml
Nodeppt
This is probably the best web presentation tool so far!
Stars: ✭ 9,589 (+53172.22%)
Mutual labels:  posthtml
run-script-webpack-plugin
Automatically run your script once Webpack's build completes.
Stars: ✭ 25 (+38.89%)
Mutual labels:  deps-url

npm node deps tests coverage code style chat

Gulp PostHTML

Install

npm i -D gulp-posthtml

Usage

import { task, src, dest } from 'gulp'

import posthtml from 'gulp-posthtml'

task('html', () => {
  return src('src/*.html')
    .pipe(posthtml())
    .pipe(dest('dest'))
})

Options

Plugins

Name Type Default Description
plugins {Array} [] PostHTML Plugins

Options

Name Type Default Description
options {Object} {} PostHTML Options

gulpfile.js

import { task, src, dest } from 'gulp'

import tap from 'gulp-tap'
import rename from 'gulp-rename'
import posthtml from 'gulp-posthtml'

task('html', () => {
  let path

  const plugins = [ require('posthtml-include')({ root: path }) ]
  const options = { parser: require('posthtml-sugarml')() }

  return src('src/*.html')
    .pipe(tap((file) => path = file.path))
    .pipe(posthtml(plugins, options))
    .pipe(rename({ ext: '.html' }))
    .pipe(dest('dest'))
})

Config

Name Type Default Description
plugins {Array} [] PostHTML Plugins
options {Object} {} PostHTML Options

gulpfile.js

import { task, src, dest } from 'gulp'

import rename from 'gulp-rename'
import posthtml from 'gulp-posthtml'


task('ssml', () => {
  const config = (file) => ({
    plugins: [ require('posthtml-include')({ root: file.dirname }) ],
    options: { parser: require('posthtml-sugarml')() }
  })

  return src('src/*.sml')
    .pipe(posthtml(config))
    .pipe(rename({ ext: '.html' }))
    .pipe(dest('dest'))
})

posthtml.config.js

Context

Name Type Default Description
env {String} 'development' process.env.NODE_ENV
file {Object} dirname, basename, extname File
options {Object} {} Options (Parser, Render, Plugin Options)

posthtml.config.js

module.exports = ({ file, options, env }) => ({
  parser: 'posthtml-sugarml'
  plugins: {
    'posthtml-include': { root: file.dirname },
    'posthtm-expressions': { locals: options.locals }
    'htmlnano': env === 'production' ? {} : false
  }
})

gulpfile.js

import { task, src, dest } from 'gulp'

import rename from 'gulp-rename'
import posthtml from 'gulp-posthtml'


task('ssml', () => {
  const ctx = { locals: { a: 'Hello World!'} }

  return src('src/*.sml')
    .pipe(posthtml(ctx))
    .pipe(rename({ ext: '.html' }))
    .pipe(dest('dest'))
})

Maintainer


Ivan Voischev

Contributors


Michael Ciniawsky
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].