gureact

Don't use it, use project/gureact2

• development is hard: use yarn link
• what happends when two project use different dependencies
• typescript not work
• each project has its own ui standard.

Philosophy: each compnent is independent.

import { Button } from 'gureact'
import { TextField } from 'gureact/antd'

<ThemeProvider theme={theme}>
  <Button />
</ThemeProvider>

const theme = { primary }

Install

$ yarn add gureact
MDC: yarn add material-components-web react-material-components-web
Antd: yarn add antd

# src/_variables.scss

  $mdc-theme-primary: #3b5999;

# webpack.config.js

  {
    loader: 'sass-loader',
    options: {
      includePaths: [path.resolve(__dirname, 'src'), path.resolve(__dirname, 'node_modules')]
    }
  }

# .babelrc
  plugins: [
    ['transform-imports', {
      'gureact': { transfrom: 'gureact/lib/core/${member}/${member} },
      'gureact/antd': { transfrom: 'gureact/lib/antd/${member}/${member} },

import { Button } from 'gureact'

yarn add lodash styled-components classnames react-icons recompose react-router react-router-dom

Setup global styles

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
a, a:hover, a:visited {
  text-decoration: none;
}

Setup react-icons

class App extends React.Component {
  static childContextTypes = {
    reactIconBase: PropTypes.object
  }

  getChildContext() {
    return {
      reactIconBase: {
        size: 32,
        className: 'icon',
      }
    }
  }