question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to use Linaria in create react app 2

See original GitHub issue

Do you want to request a feature or report a bug? Its not a bug or feature but it would be great if it mentioned somewhere on how to use it with create react app.

what configuration need to be changed in order to make it work with create-react-app. I tried whatever babel preset config was mentioned with craco but I was getting error like below.

Error: Using the "css" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly.

Currently, I am using create-react-app2(with inbuilt typescript support) with craco to provide customised config if create-react-app does not support any thing by default.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:3
  • Comments:6 (5 by maintainers)

github_iconTop GitHub Comments

5reactions
satya164commented, Jan 6, 2019

Linaria requires a webpack loader, so it won’t work without ejecting from CRA as CRA doesn’t allow you to customize the webpack config.

See https://github.com/callstack/linaria/blob/master/docs/BUNDLERS_INTEGRATION.md#webpack for the setup instructions.

4reactions
satya164commented, Feb 22, 2019

A babel macro will provide very bad UX. See my comments here.

Maybe it’ll be nice if someone publishes react-scripts-linaria which we can link to in our docs.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Create React App With Linaria - Better Programming
Linaria can work for your needs. Linaria generates CSS with zero runtime, which means that CSS is extracted to link tag in HTML...
Read more >
Using Linaria for faster CSS-in-JS in React apps
In this article, we will explore how to use a zero-runtime CSS-in-JS library called Linaria in React applications.
Read more >
@linaria/react - npm
Latest version: 4.3.2, last published: 18 days ago. Start using @linaria/react in your project by running `npm i @linaria/react`.
Read more >
Create React App With Linaria - Morioh
Learn how to create React App with Linaria. We will walk you through how to introduce Linaria to the create-react-app. Linaria generates CSS...
Read more >
Linaria | npm.io
A craco plugin to use Linaria zero-runtime CSS in JS library in a create react app. cracopluginlinariacracreate-react-app. 1.1.2 • Published 3 years ago ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found