next-compose
v0.0.2
Published
Compose NextJs plugins in a simple way
Downloads
4,048
Readme
next-compose
Compose next-plugins in a simple way
Installation
npm install -D next-compose
or
yarn add -D next-compose
Usage
Simple example with TypeScript and Sass plugins:
const withTS = require('@zeit/next-typescript')
const withSass = require('@zeit/next-sass')
const compose = require('next-compose')
const tsConfig = {/** ts config here */}
const sassConfig = {/** sass config here */}
module.exports = compose([
[withTS, tsConfig],
[withSass, sassConfig],
{
webpack: (config) => {
/**some special code */
return config
}
}
])
Example with build vendor.css
and app.css
from different input extensions:
const withLess = require('@zeit/next-less')
const withSass = require('@zeit/next-sass')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const commonsChunkConfig = require('@zeit/next-css/commons-chunk-config')
const compose = require('./scripts/next-compose')}
const extractVendorCSSPlugin = new ExtractTextPlugin('static/vendor.css')
const extractAppCSSPlugin = new ExtractTextPlugin('static/app.css')
module.exports = compose([
[withLess, {
cssLoaderOptions: { modules: false },
lessLoaderOptions: { /** less loader options */ },
extractCSSPlugin: extractVendorCSSPlugin
}],
[withSass, {
cssLoaderOptions: {
modules: true,
localIdentName: '[local]-[hash:base64:5]',
},
sassLoaderOptions: { /** sass loader options */ },
extractCSSPlugin: extractAppCSSPlugin,
}],
{
webpack(config, options) {
config.plugins.push(extractVendorCSSPlugin)
config.plugins.push(extractAppCSSPlugin)
if (!options.isServer) {
config = commonsChunkConfig(config, /\.(less|scss|sass)$/)
}
return config
}
}
])