https://github.com/anber/linaria-interop

Babel plugin for supporting interop between Linaria and Emotion/styled-components
https://github.com/anber/linaria-interop

Last synced: 25 days ago
JSON representation

Babel plugin for supporting interop between Linaria and Emotion/styled-components

• Host: GitHub
• URL: https://github.com/anber/linaria-interop
• Owner: Anber
• License: mit
• Created: 2019-05-27T13:28:30.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-09T04:06:24.000Z (almost 2 years ago)
• Last Synced: 2024-05-01T19:16:24.652Z (6 months ago)
• Language: JavaScript
• Size: 604 KB
• Stars: 2
• Watchers: 4
• Forks: 0
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# `babel-plugin-linaria-interop`

This plugin allows to interpolate Linaria components inside styled-components and Emotion:

```javascript

import styled from 'styled-components';

import { Title } from './Title.styled'; // Linaria component

const Article = () => { /* … */ };

export default styled(Article)`

  & > ${Title} {

    color: green;

  }

`;

```

## Quick start

Install the plugin first:

```

npm install --save-dev babel-plugin-linaria-interop

```

Then add `linaria-interop` to your babel configuration *before* `styled-components`:

```JSON

{

  "plugins": [

    ["linaria-interop", { "library": "styled-components" }],

    "styled-components"

  ]

}

```