Giter Club home page Giter Club logo

dust-loader-complete's Introduction

dust-loader-complete

A complete webpack loader for DustJS files.

Overview

dust-loader-complete is a webpack loader for DustJS files that compiles DustJS template files into their JavaScript template functions. It has two main advantages over the alternatives:

  1. Instead of returning the template function itself, it returns a wrapper function that can be called directly.
  2. It automatically finds all partials and requires them, which adds them into your webpack bundle.

Note

  • As of version 1.4.0, the returned wrapper function has a property templateName that holds the registered name of the template.

Installation

    npm install --save-dev dust-loader-complete

Usage

There are two changes you need to make to your webpack configuration in order to use dust-loader-complete.

First, add the following to the array of loaders (assuming your dust files are saved with a .dust extension):

    { test: /\.dust$/, loader: "dust-loader-complete" }

Second, provide an alias for the dustjs-linkedin module. dust-loader-complete writes a var dust = require( ) method at the top of every compiled template. It needs to know how to require the DustJS module. The default is to use the alias dustjs:

    alias: {
        dustjs: 'dustjs-linkedin'
    }

Note

If you want to use NPM's dustjs-helpers module, you'll have to add the following alias:

    alias: {
        ....
        'dust.core': 'dustjs-linkedin'
    }

Options

dust-loader-complete offers several options to customize its behavior. Read the loader documentation to learn more about how to set loader options.

root

Set a root path for your dust templates. This root will be removed from the beginning of the dust module path before it is turned into the template name via the namingFn.

dustAlias

Customize the alias used for DustJS. Must match the alias set in the webpack configuration.

wrapperGenerator

This option must be set via the "global" configuration object. What this means is that in your webpack configuration object, create a top-level object with the name `dust-loader-complete':

    {
        entry: '/path/to/entry.js',
        ....
        'dust-loader-complete': {
            wrapperGenerator: function ( name ) { .... }
        }
    }

This function generates the dust.render wrapper function. It receives a single parameter, the template name as a string, and it must return a string that when written out to the webpack JavaScript file will render the dust template. For example, the default function is

    function defaultWrapperGenerator( name ) {
      return "function( context, callback ) { dust.render( '" + name + "', context, callback ); }";
    }

verbose

Set verbose: true to see console logs from dust-loader-complete

dust-loader-complete's People

Contributors

jrrbru avatar pastelsky avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar

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.