1 | ## Explanation of Build Files
|
2 |
|
3 | | UMD | CommonJS | ES Module |
|
4 | | --- | --- | --- |
|
5 | | index.js | index.common.js | index.esm.js |
|
6 |
|
7 | ### Terms
|
8 |
|
9 | - **[UMD](https://github.com/umdjs/umd)**: UMD builds can be used directly in the browser via a `<script>` tag. The default file from Unpkg CDN at [https://unpkg.com/fast-average-color](https://unpkg.com/fast-average-color) `index.js`.
|
10 |
|
11 | - **[CommonJS](http://wiki.commonjs.org/wiki/Modules/1.1)**: CommonJS builds are intended for use with older bundlers like [browserify](http://browserify.org/) or [webpack 1](https://webpack.github.io). The default file for these bundlers (`pkg.main`) is the Runtime only CommonJS build (`index.common.js`).
|
12 |
|
13 | - **[ES Module](http://exploringjs.com/es6/ch_modules.html)**: ES module builds are intended for use with modern bundlers like [webpack 2](https://webpack.js.org) or [rollup](http://rollupjs.org/). The default file for these bundlers (`pkg.module`) is the Runtime only ES Module build (`index.esm.js`).
|
14 |
|
15 | #### Webpack
|
16 |
|
17 | ``` js
|
18 | module.exports = {
|
19 | // ...
|
20 | resolve: {
|
21 | alias: {
|
22 | 'fast-average-color': 'fast-average-color/dist/index.esm.js' // 'fast-average-color/dist/index.common.js' for webpack 1
|
23 | }
|
24 | }
|
25 | }
|
26 | ```
|
27 |
|
28 | #### Rollup
|
29 |
|
30 | ``` js
|
31 | const alias = require('rollup-plugin-alias')
|
32 |
|
33 | rollup({
|
34 | // ...
|
35 | plugins: [
|
36 | alias({
|
37 | 'fast-average-color': 'fast-average-color/dist/index.esm.js'
|
38 | })
|
39 | ]
|
40 | })
|
41 | ```
|
42 |
|
43 | #### Browserify
|
44 |
|
45 | Add to your project's `package.json`:
|
46 |
|
47 | ``` js
|
48 | {
|
49 | // ...
|
50 | "browser": {
|
51 | "fast-average-color": "fast-average-color/dist/index.common.js"
|
52 | }
|
53 | }
|
54 | ```
|