Giter VIP home page Giter VIP logo

jsreport-pug's Introduction

jsreport-pug

Build Status

Use pug templating engine in jsreport and jsreport-core

npm install jsreport-pug

You can access the input data through pug locals and you can find helpers on templateHelpers

doctype html
html(lang="en")
  head
  body
    p Hello from helper: #{templateHelpers.hello()}
    p Hello from input data: #{hello}

Guide: jsreport-cli with pug template engine instalation

  1. Create a local folder that will hold the server, i.e. (~/myTools/jsreport)
  2. Go to that directory (cd ~/myTools/jsreport)
  3. Do yarn global add jsreport-cli (you can also use npm install -g jsreport-cli)
  4. Execute jsreport init (this will create folder structure)
  5. Add this template engine or anyother (i.e. ejs) this command: yarn add jsreport-pug
  6. Start the server with this command jsreport start

When jsreport starts, it looks for engines in node_modules folder and if it founds any it loads them with no extra configuration.

See the playground example

jsreport-pug's People

Contributors

bjrmatos avatar greenkeeperio-bot avatar joeesteves avatar pofider avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

jsreport-pug's Issues

Recipe Support

Will this only work with the phantom-pdf or html recipes? I was trying to get it to work with the xlsx recipe but I have not had much luck

Does not work with jsreport

I don't think this works with jsreport, at least not with jsreport-core. If you follow the example on the jsreport-core website you can't really drop this in place as an engine. You just get the {"name": ... "main":...} object back. Can't really initialize it like other modules and tell jsreport to .use() it.

Installation Guide - Instalación con jsreport-cli

@bjrmatos Como estas ?
Gracias por el engine!
Me costo un poco encontrar la vuelta para hacer una instalación asique una vez que logre hacerlo hice un mini guía que puede servir a otros .
Te lo pongo acá por si querés incluir en el readme

To install Jade / Pug (or any other template engine) with jsreport you con follow these steps:

  1. First off all, create a local folder that will hold the server, i.e. (~/myTools/jsreport)
  2. Go to that directory. (cd ~/myTools/jsreport)
  3. yarn global add jsreport-cli (you can also use npm install -g jsreport-cli)
  4. Execute the command: jsreport init (this will create folder structure)
  5. Add jade or ejs or the template engine package to folder with these command: yarn add jsreport-jade
    start the server running jsreport start

Guide Link

saludos

How to use css assets?

Can not figure out how I can include css file from assets to the template.
Tried with

doctype html
html(lang="en")
  style 
    !{{#asset styles.css @encoding=utf8}}
  head
  body

And with

doctype html
html(lang="en")
  style 
    | {#asset styles.css @encoding=utf8}
  head
  body

How is it supposed to do this?

templateHelpers not working in pug engine

I have this code in NodeJS.

jsreport.render({
   template: {
		content: 'h1 Hello #{templateHelpers.foo()}',
		helpers: { foo: () => { return 'world' } },
		engine: 'pug',
		recipe: 'chrome-pdf'
	},
	data: {
					},
}).then((out) => {
	out.stream.pipe(res);
}).catch((e) => {
	res.end(e.message);
});

I tried various combinations and could not get visibility of the helper method 'foo'. Am I missing something?

Error while executing templating engine. templateHelpers.foo is not a function on line 1

Using includes with jsreport not working

We get the following when including a pug template in jsreport studio.
Error while executing templating engine. the "filename" option is required to use includes and extends with "relative" paths

doctype html
html(lang='en')
head
title Pug
body
h1 Pug Examples
div.container
p Cool Pug example!
each row in cxEmployees
each value, field in row
!= t1(field)
include includes/test4.pug

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.