Merge pull request styled-components#1391 from stratiformltd/warn_on_…

…react_native

Add warning if importing Web Styled Components on React Native

CHANGELOG.md

@@ -8,6 +8,8 @@ All notable changes to this project will be documented in this file. If a contri
 
 - Fixed nested themes not being republished on outer theme changes, thanks to [@Andarist](https://github.com/Andarist) (see [#1382](https://github.com/styled-components/styled-components/pull/1382))
 
+- Add warning if you've accidently imported 'styled-components' on React Native instead of 'styled-components/native', thanks to [@tazsingh](https://github.com/tazsingh) (see [#1391](https://github.com/styled-components/styled-components/pull/1391))
+
 ## [v2.4.0] - 2017-12-22
 
 - remove some extra information from the generated hash that can differ between build environments ([see #1381](https://github.com/styled-components/styled-components/pull/1381))

src/index.js

@@ -22,6 +22,19 @@ import ThemeProvider from './models/ThemeProvider'
 /* Import Higher Order Components */
 import withTheme from './hoc/withTheme'
 
+/* Warning if you've imported this file on React Native */
+if (
+  process.env.NODE_ENV !== 'production' &&
+  navigator &&
+  navigator.product === 'ReactNative'
+) {
+  console.warn(
+    "It looks like you've imported 'styled-components' on React Native.\n" +
+      "Perhaps you're looking to import 'styled-components/native'?\n" +
+      'Read more about this at https://www.styled-components.com/docs/basics#react-native',
+  )
+}
+
 /* Instantiate singletons */
 const ComponentStyle = _ComponentStyle(
   generateAlphabeticName,