Enable `css` prop for React Native

garyking commented 4 years ago

After installing babel-plugin-styled-components package in a React Native project, and having plugins: ['babel-plugin-styled-components'], in the Babel config, the css prop still does not work.

Please make this possible. Thanks!

VineetKumarKushwaha commented 4 years ago

I am also facing this issue for normal react web application below are the details:-

React JS project:- "react": "^16.13.1", "babel-plugin-styled-components": "1.9.3",

.babelrc

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react",
    "@babel/preset-typescript"
  ],
  "plugins": ["macros", ["babel-plugin-styled-components", {
        "transpileTemplateLiterals": false,
        "ssr": false
    }]]
}

Below is the component code

<Button
    css={css`
        width: 96px;
        margin-right: 20px;
    `}
    label="EXPORT"
    onClick={() => {}}
    secondary
/>

Output:- ButtonDropdown__ButtonDropdownStyled-hnkbZB ButtonDropdown___StyledButtonDropdownStyled-gdeAkJ eTzaWd

Passed CSS is not working

Dstklr commented 4 years ago

After adding "babel-plugin-styled-components" to the babel.config.js and using 'css' from styled-components, im getting the following error when starting the react project: "Uncaught TypeError: styled.css.withConfig is not a function"

styled-components / babel-plugin-styled-components

Enable `css` prop for React Native #272