Styling Template

CSS

CSS is supported out of the box:

import React from 'react';
import './app.css';

const Button = () => (
    <button className='button'>Click Me</button>
);

export default Button;

class names will be shared across all templates!

CSS Modules

CSS Modules is supported by creating css files with the extention .module.css:

import React from 'react';
import './Button.module.css';

const Button = () => (
    <button className='button'>Click Me</button>
);

export default Button;

class names will be unique for the specific template

Styled Components

To use styled-components just install styled-components and use it:

import React from 'react';
import styled from 'styled-components`

const PrimaryButton = styled.button`
    color: red;
`;

const Button = () => (
    <PrimaryButton>Click Me</PrimaryButton>
);

export default Button;

You can add babel-plugin-styled-components by creating a custom babelrc.