Watch a live product demo 👀 See how Sanity powers richer commerce experiences

Using Babelrc File to Style React Components

10 replies
Last updated: Oct 7, 2020
Any issues with using styled-components with sanity?
Oct 7, 2020, 4:53 PM
If anyone else is curious seems to work fine. Only issue was I wasnt able to add the “babel-plugin-styled-components” because having a custom .babelrc file throws errors and prevents sanity from starting. Wasn’t able to find any info on how to customize the webpack for sanity.
Oct 7, 2020, 7:11 PM
there was an issue on the sanity repo about customizing webpack 🙂 but not possible yet, only babelrc as you said
Oct 7, 2020, 7:25 PM
Yeah I saw that issue maybe it will be possible one day. So are you able to add a .babelrc file? Mine threw some errors when I added it.
Oct 7, 2020, 7:27 PM
I did! I saw some code in the sanity repo that picks up the babelrc file if it is present
Oct 7, 2020, 7:28 PM
  "presets": [
        "targets": {
          "node": "8",
          "chrome": "59",
          "safari": "10",
          "firefox": "56",
          "edge": "14"
        "modules": "commonjs"
  "plugins": ["@babel/plugin-proposal-class-properties", "babel-plugin-macros"]
Oct 7, 2020, 7:28 PM
I combined what I found in babelrc in
user U
/base and in the root dir if im not mistaken
Oct 7, 2020, 7:28 PM
Nice! Thanks for the share!
Oct 7, 2020, 7:28 PM
Cause it needs to have at least the same config
Oct 7, 2020, 7:29 PM
Then I added "babel-plugin-macros" myself 🙂
Oct 7, 2020, 7:29 PM
Sweet I’ll give it a shot
Oct 7, 2020, 7:29 PM – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Related answers

Get more help in the community Slack

TopicCategoriesFeaturedRepliesLast Updated
After adding the subtitle and running this code npm run graphql-deploy It does nothingSep 15, 2020
how to limit a reference to just one entry in Studio reference input side versus the default as-many-entries-as-you-fill-in-an-array...Sep 18, 2020
Is it possible to fetch more than one "_type" using GROQ?Nov 2, 2020
I want to add a view with the Structure builder (S.view.component) where I list similar documents based on the title. What...Sep 23, 2020
Is there a structure builder example where the format of each preview for the document list is modified?Feb 3, 2021
I have an array of references to a country schema type but it always just returns NULL values for meJan 30, 2021
Hi, I need help with a query for getting the url of an image asset. Here is what I've been trying, but I only get the _ref...Dec 1, 2020
Sanity UI looks brilliant :smiley: Is something like the current date picker possible at the moment? I’m not sure if anicon...Dec 21, 2020
Hey everyone. I have been coding and may have potentially accidentally deleted something. Does anyone know how to resolve...Dec 26, 2020
Hello everyone and happy new year :raised_hands::skin-tone-2:, I have a problem with outputting Portable Text :disappointed:...Jan 1, 2021

Related contributions

Clean Next.js + Sanity app
- Template

Official(made by Sanity team)

A clean example of Next.js with embedded Sanity ready for recomposition.

Cody Olsen
Go to Clean Next.js + Sanity app

Blog with Built-in Content Editing
- Template

Official(made by Sanity team)

A Sanity-powered blog with built-in content editing and instant previews.

Go to Blog with Built-in Content Editing