rollup-plugin-angular
Angular2 template and styles inliner
Last updated 3 years ago by cebor .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install rollup-plugin-angular 
SYNC missed versions from official npm registry.

Build Status

rollup-plugin-angular

Angular2 template and styles inliner for rollup

Looking for new maintainer

I have no time to maintain this plugin anymore. So im looking for a new Maintainer. Feel free to create an issue, when you want to maintain this plugin.

Installation

npm install --save-dev rollup-plugin-angular

Example

// rollup.config.js
import angular from 'rollup-plugin-angular';
import typescript from 'rollup-plugin-typescript';
import alias from 'rollup-plugin-alias';
import nodeResolve from 'rollup-plugin-node-resolve';

export default {
  entry: 'src/main.ts',
  format: 'iife',
  dest: 'dist/bundle.js',
  plugins: [
    angular(),
    typescript(),
    alias({ rxjs: __dirname + '/node_modules/rxjs-es' }), // rxjs fix (npm install rxjs-es)
    nodeResolve({ jsnext: true, main: true })
  ]
}

Template & Style preprocessing

You may need to do some preprocessing on your templates & styles such as minification and/or transpilation.

To do this you can pass a preprocessors object as an option, containing a style and/or template preprocessor.

If you are using rollup on a source that has already been transpiled to JavaScript you will also need to set the sourcetype.

Signature

sourcetype: 'js' //defaults to 'ts'
preprocessors: {
  template: (source: string, path: string) => string,
  style: (source: string, path: string) => string,
}

source - The contents of the style or template's file.

path - The path to the loaded file. Can be useful for checking file extensions for example.

returns the manipulated source as a string.

Example

The following example shows how you can use sass, clean-css (for css minification), and htmlmin.

// rollup.config.js
import angular from 'rollup-plugin-angular';
import typescript from 'rollup-plugin-typescript';
import nodeResolve from 'rollup-plugin-node-resolve';
import sass from 'node-sass';
import CleanCSS from 'clean-css';
import { minify as minifyHtml } from 'html-minifier';

const cssmin = new CleanCSS();
const htmlminOpts = {
    caseSensitive: true,
    collapseWhitespace: true,
    removeComments: true,
};

export default {
  input: 'src/main.ts',
  output: {
    format: 'umd',
    file: 'dist/bundle.js'
  },
  plugins: [
    angular({
      // additional replace `templateUrl` and `stylesUrls` in every `.js` file
      // default: true
      replace: false, 
      preprocessors: {
        template: template => minifyHtml(template, htmlminOpts),
        style: scss => {
            const css = sass.renderSync({ data: scss }).css;
            return cssmin.minify(css).styles;
        },
      }
    })
    typescript(),
    nodeResolve({ jsnext: true, main: true })
  ]
}

Current Tags

  • 0.5.3                                ...           latest (3 years ago)

34 Versions

  • 0.5.3                                ...           3 years ago
  • 0.5.2                                ...           3 years ago
  • 0.5.1                                ...           3 years ago
  • 0.5.0                                ...           3 years ago
  • 0.4.12                                ...           3 years ago
  • 0.4.11                                ...           3 years ago
  • 0.4.8                                ...           3 years ago
  • 0.4.7                                ...           3 years ago
  • 0.4.6                                ...           3 years ago
  • 0.4.4                                ...           4 years ago
  • 0.4.3                                ...           4 years ago
  • 0.4.2                                ...           4 years ago
  • 0.4.1                                ...           4 years ago
  • 0.4.0                                ...           4 years ago
  • 0.3.0                                ...           4 years ago
  • 0.2.9                                ...           4 years ago
  • 0.2.8                                ...           4 years ago
  • 0.2.7                                ...           4 years ago
  • 0.2.6                                ...           4 years ago
  • 0.2.5                                ...           4 years ago
  • 0.2.4                                ...           4 years ago
  • 0.2.3                                ...           4 years ago
  • 0.2.2                                ...           4 years ago
  • 0.2.0                                ...           4 years ago
  • 0.1.9                                ...           4 years ago
  • 0.1.8                                ...           4 years ago
  • 0.1.7                                ...           4 years ago
  • 0.1.6                                ...           4 years ago
  • 0.1.5                                ...           4 years ago
  • 0.1.4                                ...           4 years ago
  • 0.1.3                                ...           4 years ago
  • 0.1.2                                ...           4 years ago
  • 0.1.1                                ...           4 years ago
  • 0.1.0                                ...           4 years ago

Copyright 2014 - 2016 © taobao.org |