├── LICENSE
├── README.md
├── index.js
└── package.json


/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2018 Artem Abzanov
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # next-compose
 2 | Compose next-plugins in a simple way
 3 | 
 4 | ## Installation
 5 | 
 6 | ```sh
 7 | npm install -D next-compose
 8 | ```
 9 | 
10 | or
11 | 
12 | ```sh
13 | yarn add -D next-compose
14 | ```
15 | 
16 | ## Usage
17 | 
18 | Simple example with TypeScript and Sass plugins:
19 | 
20 | ```js
21 | const withTS = require('@zeit/next-typescript')
22 | const withSass = require('@zeit/next-sass')
23 | const compose = require('next-compose')
24 | 
25 | const tsConfig = {/** ts config here */}
26 | const sassConfig = {/** sass config here */}
27 | 
28 | module.exports = compose([
29 |   [withTS, tsConfig],
30 |   [withSass, sassConfig],
31 |   {
32 |     webpack: (config) => {
33 |       /**some special code */
34 |       return config
35 |     }
36 |   }
37 | ])
38 | ```
39 | 
40 | Example with build `vendor.css` and `app.css` from different input extensions:
41 | 
42 | ```js
43 | const withLess = require('@zeit/next-less')
44 | const withSass = require('@zeit/next-sass')
45 | const ExtractTextPlugin = require('extract-text-webpack-plugin')
46 | const commonsChunkConfig = require('@zeit/next-css/commons-chunk-config')
47 | const compose = require('./scripts/next-compose')}
48 | 
49 | const extractVendorCSSPlugin = new ExtractTextPlugin('static/vendor.css')
50 | const extractAppCSSPlugin = new ExtractTextPlugin('static/app.css')
51 | 
52 | module.exports = compose([
53 |   [withLess, {
54 |     cssLoaderOptions: { modules: false },
55 |     lessLoaderOptions: { /** less loader options */ },
56 |     extractCSSPlugin: extractVendorCSSPlugin
57 |   }],
58 |   [withSass, {
59 |     cssLoaderOptions: {
60 |       modules: true,
61 |       localIdentName: '[local]-[hash:base64:5]',
62 |     },
63 |     sassLoaderOptions: { /** sass loader options */ },
64 |     extractCSSPlugin: extractAppCSSPlugin,
65 |   }],
66 |   {
67 |     webpack(config, options) {
68 |       config.plugins.push(extractVendorCSSPlugin)
69 |       config.plugins.push(extractAppCSSPlugin)
70 | 
71 |       if (!options.isServer) {
72 |         config = commonsChunkConfig(config, /\.(less|scss|sass)$/)
73 |       }
74 | 
75 |       return config
76 |     }
77 |   }
78 | ])
79 | ```
80 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | module.exports = plugins => ({
 2 |   webpack(config, options) {
 3 |     return plugins.reduce((config, plugin) => {
 4 |       if (plugin instanceof Array) {
 5 |         const [_plugin, ...args] = plugin
 6 |         plugin = _plugin(...args)
 7 |       }
 8 |       if (plugin instanceof Function) {
 9 |         plugin = plugin()
10 |       }
11 |       if (plugin && plugin.webpack instanceof Function) {
12 |         return plugin.webpack(config, options)
13 |       }
14 |       return config
15 |     }, config)
16 |   },
17 | 
18 |   webpackDevMiddleware(config) {
19 |     return plugins.reduce((config, plugin) => {
20 |       if (plugin instanceof Array) {
21 |         const [_plugin, ...args] = plugin
22 |         plugin = _plugin(...args)
23 |       }
24 |       if (plugin instanceof Function) {
25 |         plugin = plugin()
26 |       }
27 |       if (plugin && plugin.webpackDevMiddleware instanceof Function) {
28 |         return plugin.webpackDevMiddleware(config)
29 |       }
30 |       return config
31 |     }, config)
32 |   }
33 | })
34 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "next-compose",
 3 |   "version": "0.0.2",
 4 |   "description": "Compose NextJs plugins in a simple way",
 5 |   "main": "index.js",
 6 |   "repository": {
 7 |     "type": "git",
 8 |     "url": "https://github.com/JerryCauser/next-compose.git"
 9 |   },
10 |   "author": "Artem Abzanov <developer@abzanov.com>",
11 |   "license": "MIT"
12 | }
13 | 


--------------------------------------------------------------------------------