1 | <p align="center">
|
2 | <img src="https://jlmakes.com/logos/png/karma-rollup-preprocessor.png?v=1" width="200px" >
|
3 | </p>
|
4 |
|
5 | <br>
|
6 |
|
7 | <p align="center">
|
8 | <img src="https://jlmakes.com/logos/svg/karma-rollup-logotype.svg" width="200px" alt="Karma + Rollup">
|
9 | </p>
|
10 |
|
11 | <p align="center">Karma preprocessor to bundle ES modules using <a href="http://rollupjs.org/">Rollup</a>.</p>
|
12 |
|
13 | <p align="center">
|
14 | <a href="https://travis-ci.org/jlmakes/karma-rollup-preprocessor">
|
15 | <img src="https://img.shields.io/travis/jlmakes/karma-rollup-preprocessor.svg" alt="Build Status">
|
16 | </a>
|
17 | <a href="https://david-dm.org/jlmakes/karma-rollup-preprocessor">
|
18 | <img src="https://img.shields.io/david/jlmakes/karma-rollup-preprocessor.svg" alt="Dependency Status">
|
19 | </a>
|
20 | <a href="https://www.npmjs.com/package/karma-rollup-preprocessor">
|
21 | <img src="https://img.shields.io/npm/dm/karma-rollup-preprocessor.svg" alt="Downloads">
|
22 | </a>
|
23 | <a href="https://www.npmjs.com/package/karma-rollup-preprocessor">
|
24 | <img src="https://img.shields.io/npm/v/karma-rollup-preprocessor.svg" alt="Version">
|
25 | </a>
|
26 | <a href="https://opensource.org/licenses/MIT">
|
27 | <img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT License">
|
28 | </a>
|
29 | </p>
|
30 |
|
31 | <br>
|
32 |
|
33 | ## Features
|
34 |
|
35 | - Rebundles your files when watched dependencies change
|
36 | - Caches bundle output for improved performance
|
37 | - Maintained with ![heart](http://i.imgur.com/oXJmdtz.gif) by [@jlmakes](https://twitter.com/jlmakes)
|
38 |
|
39 | <br>
|
40 |
|
41 | ## Installation
|
42 |
|
43 | ```bash
|
44 | npm install karma-rollup-preprocessor
|
45 | ```
|
46 |
|
47 | <br>
|
48 |
|
49 | ## Configuration
|
50 |
|
51 | All the options detailed in the [Rollup Documentation](https://github.com/rollup/rollup/wiki/JavaScript-API) can be passed to `rollupPreprocessor`.
|
52 |
|
53 | ### Standard
|
54 |
|
55 | Below is a well-founded recommendation using the [Bublé](https://buble.surge.sh) ES2015 transpiler:
|
56 |
|
57 | ```js
|
58 | // karma.conf.js
|
59 | module.exports = function(config) {
|
60 | config.set({
|
61 | files: [
|
62 | /**
|
63 | * Make sure to disable Karma’s file watcher
|
64 | * because the preprocessor will use its own.
|
65 | */
|
66 | { pattern: 'test/**/*.spec.js', watched: false },
|
67 | ],
|
68 |
|
69 | preprocessors: {
|
70 | 'test/**/*.spec.js': ['rollup'],
|
71 | },
|
72 |
|
73 | rollupPreprocessor: {
|
74 | /**
|
75 | * This is just a normal Rollup config object,
|
76 | * except that `input` is handled for you.
|
77 | */
|
78 | plugins: [require('rollup-plugin-buble')()],
|
79 | output: {
|
80 | format: 'iife', // Helps prevent naming collisions.
|
81 | name: '<your_project>', // Required for 'iife' format.
|
82 | sourcemap: 'inline', // Sensible for testing.
|
83 | },
|
84 | },
|
85 | })
|
86 | }
|
87 | ```
|
88 |
|
89 | <br>
|
90 |
|
91 | ### Configured Preprocessors
|
92 |
|
93 | Below shows an example where [configured preprocessors](http://karma-runner.github.io/1.0/config/preprocessors.html) can be very helpful:
|
94 |
|
95 | ```js
|
96 | // karma.conf.js
|
97 | module.exports = function(config) {
|
98 | config.set({
|
99 | files: [{ pattern: 'test/**/*.spec.js', watched: false }],
|
100 |
|
101 | preprocessors: {
|
102 | 'test/buble/**/*.spec.js': ['rollup'],
|
103 | 'test/babel/**/*.spec.js': ['rollupBabel'],
|
104 | },
|
105 |
|
106 | rollupPreprocessor: {
|
107 | plugins: [require('rollup-plugin-buble')()],
|
108 | output: {
|
109 | format: 'iife',
|
110 | name: '<your_project>',
|
111 | sourcemap: 'inline',
|
112 | },
|
113 | },
|
114 |
|
115 | customPreprocessors: {
|
116 | /**
|
117 | * Clones the base preprocessor, but overwrites
|
118 | * its options with those defined below...
|
119 | */
|
120 | rollupBabel: {
|
121 | base: 'rollup',
|
122 | options: {
|
123 | // In this case, to use a different transpiler:
|
124 | plugins: [require('rollup-plugin-babel')()],
|
125 | },
|
126 | },
|
127 | },
|
128 | })
|
129 | }
|
130 | ```
|
131 |
|
132 | Happy bundling!
|