freestyler

5th generation React styling library

54 个版本

freestyler css style styles react js in-js css-in-js styled decorator component styled-components jsxstyle jsx hoc rule stylesheet

主页

仓库

提交 Issue

安装

npm install freestyler

yarn add freestyler

pnpm add freestyler

bun add freestyler

README

libreact logo

freestyler

5^th generation React styling library — it is lightning fast, lean, and with gazillion features.

        Yeah, straight from the top of my dome
            As I rock, rock, rock, rock, rock the microphone
                Yeah, straight from the top of my dome
                    As I rock, rock, rock, rock, rock the microphone...

Bomfunk MC's — Freestyler

feat.

fifth generation, lightweight, lightning fast, JIT CSS, code splitting, dead code elimination, JavaScript variables

Typing and autocompletion

CSS Templates

Reference

Terminology
Generations
Interfaces
Generic Low-level API
Generic 3^rd Generation Interfaces
- rule() Interface
- StyleSheet.create() Interface with lazy rendering
- hyperstyle() styleName Interface
React.js 4^th Generation Interfaces
React.js 5^th Generation Interfaces
- styleit() and <Styleit> Interfaces
- jsxstyle(), <Block>, <Inline>, <InlineBlock>, <Row>, and <Column> Interfaces
Environment Variables
Server-side Rendering
How it Works?

Installation

npm i freestyler --save

Usage

import {
    css,
    styled,
    rule,
    StyleSheet,
    Component,
    hoc,
    jsxstyle
} from 'freestyler';

import hyperstyle from 'freestyler/lib/react/hyperstyle';
import {styleit, Styleit} from 'freestyler/lib/react/styleit';

Decorate stateful components.

@css({
    border: '1px solid tomato',
})
class App extends Component {
    render () {
        return <div>Hello world!</div>;
    }
}

Or, create "styled" stateless components.

const Bordered = styled.div({
    border: '1px solid tomato',
});
const App = () =>
    <Bordered>Hello world!</Bordered>;

License

Unlicense — public domain.

Are you a freestyler?

版本列表

3.1.0 2018-03-02

3.0.4 2018-03-01

3.0.3 2018-03-01

3.0.2 2018-03-01

3.0.1 2018-02-28

3.0.0-alpha.2 2018-02-28

3.0.0-alpha.1 2018-02-27

2.2.3 2018-02-26

2.2.2 2018-02-26

2.2.1 2018-02-26

2.2.0 2018-02-26

2.1.0 2018-02-25

2.0.1 2018-02-22

2.0.0-alpha.6 2018-02-22

2.0.0-alpha.5 2018-02-22

2.0.0-alpha.4 2018-02-22

2.0.0-alpha.3 2018-02-22

2.0.0-alpha.2 2018-02-22

2.0.0-alpha.1 2018-02-22

2.0.0 2018-02-22

1.10.2-beta 2018-02-21

1.10.1 2018-02-21

1.10.0 2018-02-17

1.9.2 2018-02-15

1.9.1 2018-02-15

1.9.0 2018-02-14

1.8.1 2018-02-11

1.8.0 2018-02-10

1.7.0 2018-02-10

1.6.7 2018-02-14

1.6.6 2018-02-13

1.6.5 2018-02-13

1.6.4 2018-02-13

1.6.3 2018-02-12

1.6.2 2018-02-12

1.6.1 2018-02-12

1.6.0 2018-02-09

1.5.2 2018-02-07

1.5.1 2018-02-07

1.5.0 2018-02-06

1.4.0 2018-02-05

1.3.6 2018-02-04

1.3.5 2018-02-04

1.3.4 2018-02-03

1.3.3 2018-02-03

1.3.2 2018-01-14

1.3.1 2018-01-14

1.3.0 2018-01-13

1.2.3 2018-01-13

1.2.2 2017-12-10

1.2.1 2017-10-15

1.1.0 2017-10-11

1.0.2 2017-10-08

0.1.0 2017-10-07