@caviar/next-block
The official caviar block for next.
Install
$ npm i @caviar/next-block
Usage
For most scenarios, @caviar/next-block
is used by a caviar mixer and usually should not be used directly.
Config
In [configFile].js
const CSS = require('@zeit/next-css')
module.exports = {
...otherAnchors,
[nextAnchorName] (compose) {
// The config anchor of next should always returns
// a FUNCTION!
return compose([
CSS
], {
distDir: '.next',
static: {
// Set cache-control for static files as max-age=86400
maxAge: 86400
}
})
},
[nextWebpackAnchorName] (
webpackConfig,
nextOptions,
// The webpack module which `@caviar/next-block` uses
// as the 3rd argument
webpackModule
) {
// Only add the DefinePlugin for client side
if (nextOptions.isServer) {
webpackConfig.plugins.push(
new webpackModule.DefinePlugin({
...
})
)
}
// This method must return an object
return webpackConfig
}
}
-
nextAnchorName
string
the name/key of the config anchor which is defined by the mixer who mixes@caviar/next-block
-
nextWebpackAnchorName
string
the name of the config anchor for next webpack.
extend(plugins: Array, nextConfigMixins: object): Function
extend(nextConfigMixins: object): Function
As the first and the only argument of the config anchor function, extend
is actually the withPlugins
method of next-compose-plugins
. Method extend
extends the next config of the underlying caviar [layer], and provides the ability to merge the config from the current layer with the support of next build phases (such as require('next/constants').PHASE_PRODUCTION_BUILD
).
-
plugins
Array<NextPlugin | [NextPlugin, NextPluginOptions]>
Array of next plugin instances. The first parameter ofwithPlugins
-
nextConfigMixins?
Object={}
the extra config to mix into the current next configuration. The second parameter ofwithPlugins
-
nextConfigMixins.dir
string
the next dir relative to the current working directory -
nextConfigMixins.static
object
the options for serve-static -
nextConfigMixins.staticFilePublicPath
string=/static
the url pathname prefix to route to static files
-
nextConfigMixins.dir
Hooks
...builtInBlockHooks
See [Caviar Blocks]
SyncHook
nextConfig Triggered after the next config is generated and before using.
Callback parameters:
- nextConfig
- caviarOptions
webpackConfig
Triggered after webpack config is generated and before using.
- webpackConfig
- nextOptions
- webpackModule
- caviarOptions