@wapps/gatsby-plugin-material-ui
A Gatsby plugin for Material UI with built-in server-side rendering support.
Install
npm install --save @wapps/gatsby-plugin-material-ui @material-ui/core
How to use
Edit gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@wapps/gatsby-plugin-material-ui`,
options: {
// Add any options here
},
},
],
}
Options
You can pass options to the plugin:
- theme (Object [optional]): Default to {}.
- dangerouslyUseGlobalCSS (Boolean [optional]): Defaults to false. Makes the Material-UI class names deterministic.
- productionPrefix (String [optional]): Defaults to 'jss'. The string used to prefix the class names in production.
For example:
options: {
theme: {
primaryColor: '#9c27b0',
},
productionPrefix: 'c',
}
Notes
This plugin is compatible with other CSS-in-JS solutions out of the box. To prevent unintentional style clobbering, it uses a custom jss
instance to ensure that default Material-UI styles are injected before those generated by your styling library of choice. Read more about this strategy at the Material-UI docs.