diff --git a/example/src/AdvancedEffects/Banner.js b/example/src/AdvancedEffects/Banner.js
index 5eab1b681f3637de678cf4b0d20f945506353ef7..179c1922cf3efff0369b864beb50f19aee78a64b 100644
--- a/example/src/AdvancedEffects/Banner.js
+++ b/example/src/AdvancedEffects/Banner.js
@@ -1,6 +1,6 @@
-const React = require("react-native");
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
+import React from "react-native";
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
 const shaders = GL.Shaders.create({
   banner: {
     frag: `
diff --git a/example/src/AdvancedEffects/Intro.js b/example/src/AdvancedEffects/Intro.js
index c73a2bb6cb17881b1ae3e22db883565dbd67d9a8..b68b3a395f25b6be4ed0d44a36d3e40d4350416a 100644
--- a/example/src/AdvancedEffects/Intro.js
+++ b/example/src/AdvancedEffects/Intro.js
@@ -1,10 +1,10 @@
-const React = require("react-native");
+import React from "react-native";
 const {
   View,
   Text,
 } = React;
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
 
 const shaders = GL.Shaders.create({
   drunkEffect: {
diff --git a/example/src/AdvancedEffects/Slideshow.js b/example/src/AdvancedEffects/Slideshow.js
index fc1f232ff5c9d38f61204b91ede166d1800a3f50..19d335ceb827ebf334495b65f9ee2cc87ec3cadf 100644
--- a/example/src/AdvancedEffects/Slideshow.js
+++ b/example/src/AdvancedEffects/Slideshow.js
@@ -1,9 +1,8 @@
-const React = require("react-native");
-const { View, Text, StyleSheet } = React;
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
-const TransitionGenerator = require("./TransitionGenerator");
-const Transition = require("./Transition");
+import React, { View, Text, StyleSheet } from "react-native";
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
+import TransitionGenerator from "./TransitionGenerator";
+import Transition from "./Transition";
 
 const shaders = GL.Shaders.create(TransitionGenerator.shaders);
 
diff --git a/example/src/AdvancedEffects/Transition.js b/example/src/AdvancedEffects/Transition.js
index adb7043466715398ba4bf9044f826b886057ba17..8e507b40cc362552dd72028dafff29ecaa11e794 100644
--- a/example/src/AdvancedEffects/Transition.js
+++ b/example/src/AdvancedEffects/Transition.js
@@ -1,5 +1,5 @@
-const React = require("react-native");
-const GL = require("gl-react");
+import React from "react-native";
+import GL from "gl-react";
 
 module.exports = GL.createComponent(
   ({ width, height, shader, progress, from, to, uniforms }) => {
diff --git a/example/src/AdvancedEffects/TransitionGenerator.js b/example/src/AdvancedEffects/TransitionGenerator.js
index 587002289c3f97eca563bfc6c0f6e81fff4a72c2..b70ba35d99a48b7ecdaae4c1f9df4bbae8d3e9f7 100644
--- a/example/src/AdvancedEffects/TransitionGenerator.js
+++ b/example/src/AdvancedEffects/TransitionGenerator.js
@@ -1,4 +1,4 @@
-const GlslTransitions = require("glsl-transitions");
+import GlslTransitions from "glsl-transitions";
 const byName = {};
 GlslTransitions.forEach(function (t) {
   byName[t.name] = t;
diff --git a/example/src/AdvancedEffects/Vignette.js b/example/src/AdvancedEffects/Vignette.js
index 8539830e074758eb81426337bb9b40dc24159b8e..4ed7b056e1e2847c5c16bf313742190601f57642 100644
--- a/example/src/AdvancedEffects/Vignette.js
+++ b/example/src/AdvancedEffects/Vignette.js
@@ -1,6 +1,6 @@
-const React = require("react-native");
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
+import React from "react-native";
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
 
 const shaders = GL.Shaders.create({
   imageVignette: {
diff --git a/example/src/AdvancedEffects/index.js b/example/src/AdvancedEffects/index.js
index d0173db9e97174c530c56ba30d7a666d0ca420ea..5c7c424e9724fdad1a836f50f78378ba1c7a439d 100644
--- a/example/src/AdvancedEffects/index.js
+++ b/example/src/AdvancedEffects/index.js
@@ -1,16 +1,14 @@
-const React = require("react-native");
-const {
+import React, {
   StyleSheet,
   View,
-} = React;
+} from "react-native";
 const { width: viewportW, height: viewportH } = require("Dimensions").get("window");
 
-const resolveAssetSource = require("react-native/Libraries/Image/resolveAssetSource");
-
-const Banner = require("./Banner");
-const Intro = require("./Intro");
-const Vignette = require("./Vignette");
-const Slideshow = require("./Slideshow");
+import resolveAssetSource from "react-native/Libraries/Image/resolveAssetSource";
+import Banner from "./Banner";
+import Intro from "./Intro";
+import Vignette from "./Vignette";
+import Slideshow from "./Slideshow";
 
 class AdvancedEffects extends React.Component {
 
diff --git a/example/src/Hearts/Heart.js b/example/src/Hearts/Heart.js
index 0810192c42294419760ae8f300500c841e1842bf..63d0da371684ee8a1007bfdd36f75aae10ab166f 100644
--- a/example/src/Hearts/Heart.js
+++ b/example/src/Hearts/Heart.js
@@ -1,6 +1,5 @@
 import GL from "gl-react";
-import React from "react";
-const {PropTypes} = React;
+import React, {PropTypes} from "react";
 
 const shaders = GL.Shaders.create({
   Heart: { // inspired from http://glslsandbox.com/e#29521.0
diff --git a/example/src/Hearts/index.js b/example/src/Hearts/index.js
index 96a87a85d7fbd88f383b23d0f6e189d679775e18..24367c488edc9543a39e702250156c79590f1dd3 100644
--- a/example/src/Hearts/index.js
+++ b/example/src/Hearts/index.js
@@ -1,13 +1,13 @@
-const React = require("react-native");
-const {
+import React, {
   StyleSheet,
   ListView,
   Component,
-} = React;
-const seedrandom = require("seedrandom");
-const { width: viewportWidth } = require("Dimensions").get("window");
-const {Surface} = require("gl-react-native");
-const Heart = require("./Heart");
+} from "react-native";
+import seedrandom from "seedrandom";
+import Dimensions from "Dimensions";
+const { width: viewportWidth } = Dimensions.get("window");
+import {Surface} from "gl-react-native";
+import Heart from "./Heart";
 
 const sameColor = ([r,g,b], [R,G,B]) =>
   r===R && g===G && b===B;
diff --git a/example/src/Simple/AnimatedHelloGL.js b/example/src/Simple/AnimatedHelloGL.js
index 8bb2a523af2590ded11a2a8be6d7b66ed6de7e5f..53dc336b5ece57801ad9eafb8263580db55270f9 100644
--- a/example/src/Simple/AnimatedHelloGL.js
+++ b/example/src/Simple/AnimatedHelloGL.js
@@ -1,7 +1,6 @@
-const React = require("react-native");
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
-const {Animated} = React;
+import React, {Animated} from "react-native";
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
 
 const shaders = GL.Shaders.create({
   helloGL: {
diff --git a/example/src/Simple/Button.js b/example/src/Simple/Button.js
index 1cf8b932ec697aba7598fd7f9409aae5393e18c9..a5dcb4442a669fda2434d0f9c57f4be272d97126 100644
--- a/example/src/Simple/Button.js
+++ b/example/src/Simple/Button.js
@@ -1,12 +1,10 @@
-const React = require("react-native");
-
-const {
+import React, {
   StyleSheet,
   Component,
   View,
   Text,
   TouchableOpacity
-} = React;
+} from "react-native";
 
 const styles = StyleSheet.create({
   root: {
diff --git a/example/src/Simple/HelloGL.js b/example/src/Simple/HelloGL.js
index 475087db222a15e0b27881915b3115a6f4ed6feb..b0e546af8f999d6ce7241330d7b4032e73e122c2 100644
--- a/example/src/Simple/HelloGL.js
+++ b/example/src/Simple/HelloGL.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   helloGL: {
diff --git a/example/src/Simple/HueRotate.js b/example/src/Simple/HueRotate.js
index 1c85254ea7b7f3a6c57039e46e99dfa1a2f30e45..9fc08378aab76f1d9c1208c38e41a8b6d7e740bc 100644
--- a/example/src/Simple/HueRotate.js
+++ b/example/src/Simple/HueRotate.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   hueRotate: {
diff --git a/example/src/Simple/OneFingerResponse.js b/example/src/Simple/OneFingerResponse.js
index 8cede1459d574ef0c227ac62a5753282cf35ac9a..de5bb527716563b5030995534993c24216060b08 100644
--- a/example/src/Simple/OneFingerResponse.js
+++ b/example/src/Simple/OneFingerResponse.js
@@ -1,8 +1,6 @@
-const React = require("react-native");
-const GL = require("gl-react");
-const {Surface} = require("gl-react-native");
-
-const {PanResponder, UIManager} = React;
+import React, {PanResponder, UIManager} from "react-native";
+import GL from "gl-react";
+import {Surface} from "gl-react-native";
 
 const shaders = GL.Shaders.create({
   oneFingerResponse: {
diff --git a/example/src/Simple/PieProgress.js b/example/src/Simple/PieProgress.js
index a7a8d57201225969bf6cd82d0fc8b03a85689a52..ed1032e0e85fc7d0a8e9066a653fc045cee4e6cc 100644
--- a/example/src/Simple/PieProgress.js
+++ b/example/src/Simple/PieProgress.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   pieProgress: {
diff --git a/example/src/Simple/Saturation.js b/example/src/Simple/Saturation.js
index f24ec3f1fa0812a2c4403b29021f70da87c72e82..88b6f1e8e685cdbfee4e4ddc1bc31f1b9a69fb86 100644
--- a/example/src/Simple/Saturation.js
+++ b/example/src/Simple/Saturation.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   saturation: {
diff --git a/example/src/Simple/index.js b/example/src/Simple/index.js
index 471a2bf87a0458b46da4c9af46a40e766cf60bb1..6fa741c5776072a67c6973a29d8911a16fc4095e 100644
--- a/example/src/Simple/index.js
+++ b/example/src/Simple/index.js
@@ -1,5 +1,4 @@
-const React = require("react-native");
-const {
+import React, {
   StyleSheet,
   Text,
   View,
@@ -7,9 +6,9 @@ const {
   TextInput,
   Component,
   TouchableOpacity,
-} = React;
+} from "react-native";
 
-const { Surface } = require("gl-react-native");
+import { Surface } from "gl-react-native";
 
 const {
   mdl: {
@@ -20,16 +19,15 @@ const {
   MKButton,
 } = require("react-native-material-kit");
 
-const RNFS = require("react-native-fs");
-
-const HelloGL = require("./HelloGL");
-const Saturation = require("./Saturation");
-const HueRotate = require("./HueRotate");
-const PieProgress = require("./PieProgress");
-const OneFingerResponse = require("./OneFingerResponse");
-const AnimatedHelloGL = require("./AnimatedHelloGL");
-const {Blur} = require("gl-react-blur");
-const Button = require("./Button");
+import RNFS from "react-native-fs";
+import HelloGL from "./HelloGL";
+import Saturation from "./Saturation";
+import HueRotate from "./HueRotate";
+import PieProgress from "./PieProgress";
+import OneFingerResponse from "./OneFingerResponse";
+import AnimatedHelloGL from "./AnimatedHelloGL";
+import {Blur} from "gl-react-blur";
+import Button from "./Button";
 
 class Demo extends Component {
   render () {
diff --git a/example/src/Tests/Add.js b/example/src/Tests/Add.js
index d25edd8f3a18d67461d0fac9a601cca94f08f32c..8236c1ea7f0926338dbca256b3f30f9eeb4925bb 100644
--- a/example/src/Tests/Add.js
+++ b/example/src/Tests/Add.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   add: {
diff --git a/example/src/Tests/Copy.js b/example/src/Tests/Copy.js
index 33be68e7da4ab5ef437db6c869e10899cb66d274..0005401fb9d8010d7fd0e60bdc07986868950eba 100644
--- a/example/src/Tests/Copy.js
+++ b/example/src/Tests/Copy.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   Copy: {
diff --git a/example/src/Tests/Display2.js b/example/src/Tests/Display2.js
index 003fd182219bb30a4a4837382710102ad86c24ff..074365b5eb4d4ed951f14f504e247ac6416355c1 100644
--- a/example/src/Tests/Display2.js
+++ b/example/src/Tests/Display2.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   display2: {
diff --git a/example/src/Tests/HelloGL.js b/example/src/Tests/HelloGL.js
index d944c7c7a0774e134b5bffea412afdc082987280..0b27b92018361c702e5944d84dde3aaa63bc27f1 100644
--- a/example/src/Tests/HelloGL.js
+++ b/example/src/Tests/HelloGL.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   helloGL: {
diff --git a/example/src/Tests/Layer.js b/example/src/Tests/Layer.js
index 5bef44b8124903900631610e5380d0af86e9a7a2..3d575810078fb677168e9c4c2676946fc06d11ec 100644
--- a/example/src/Tests/Layer.js
+++ b/example/src/Tests/Layer.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   layer: {
diff --git a/example/src/Tests/Multiply.js b/example/src/Tests/Multiply.js
index fde8023f05f9e1dfa3b5c9c794178e62cda69509..7e9ecb809f00571850be9a069d113a1c2bf7ada1 100644
--- a/example/src/Tests/Multiply.js
+++ b/example/src/Tests/Multiply.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   multiply: {
diff --git a/example/src/Tests/NativeLayer.js b/example/src/Tests/NativeLayer.js
index 1a10cd8071da7c468959972f0d3496a8e3ea5627..2b8908412b5aadf6ef66bc55b424c4da4bf90c0b 100644
--- a/example/src/Tests/NativeLayer.js
+++ b/example/src/Tests/NativeLayer.js
@@ -1,7 +1,4 @@
-const React = require("react-native");
-const {
-  View
-} = React;
+import React, { View } from "react-native";
 
 class NativeLayer extends React.Component {
   render () {
diff --git a/example/src/Tests/TransparentNonPremultiplied.js b/example/src/Tests/TransparentNonPremultiplied.js
index 39518a61eaad38686a068120d71b8ed9891d0343..89e8ed19945c74c06259bcc9e80f25dcc78aaa78 100644
--- a/example/src/Tests/TransparentNonPremultiplied.js
+++ b/example/src/Tests/TransparentNonPremultiplied.js
@@ -1,5 +1,5 @@
-const GL = require("gl-react");
-const React = require("react");
+import GL from "gl-react";
+import React from "react";
 
 const shaders = GL.Shaders.create({
   TransparentNonPremultiplied: {
diff --git a/example/src/Tests/index.js b/example/src/Tests/index.js
index d6d1086ccdba123c03d1cad727fff68e9d1b235b..ae8f9ed779ac9a4befcf4aa60a30f2aeeca9f6ed 100644
--- a/example/src/Tests/index.js
+++ b/example/src/Tests/index.js
@@ -1,21 +1,21 @@
-const React = require("react-native");
-const {
+import React, {
   Text,
   View,
   ScrollView,
   Image,
-} = React;
-const { Surface } = require("gl-react-native");
-const {Blur} = require("gl-react-blur");
-const Add = require("./Add");
-const Multiply = require("./Multiply");
-const Layer = require("./Layer");
-const NativeLayer = require("./NativeLayer");
-const HelloGL = require("./HelloGL");
-const Display2 = require("./Display2");
-const Copy = require("./Copy");
-const TransparentNonPremultiplied = require("./TransparentNonPremultiplied");
-const { width: viewportW, height: viewportH } = require("Dimensions").get("window");
+} from "react-native";
+import {Surface} from "gl-react-native";
+import {Blur} from "gl-react-blur";
+import Add from "./Add";
+import Multiply from "./Multiply";
+import Layer from "./Layer";
+import NativeLayer from "./NativeLayer";
+import HelloGL from "./HelloGL";
+import Display2 from "./Display2";
+import Copy from "./Copy";
+import TransparentNonPremultiplied from "./TransparentNonPremultiplied";
+import Dimensions from "Dimensions";
+const { width: viewportW, height: viewportH } = Dimensions.get("window");
 
 class Tests extends React.Component {
 
diff --git a/src/GLCanvas.captureFrame.android.js b/src/GLCanvas.captureFrame.android.js
index f16ee537b4935ae3c43b85e82d2b553c02b0892b..2c24195d3e51adacd1d92b1d10e3a96e9a11eee2 100644
--- a/src/GLCanvas.captureFrame.android.js
+++ b/src/GLCanvas.captureFrame.android.js
@@ -1,8 +1,6 @@
-const invariant = require("invariant");
-const React = require("react-native");
-const {
-  NativeModules: { UIManager }
-} = React;
+import invariant from "invariant";
+import {NativeModules} from "react-native";
+const {UIManager} = NativeModules;
 const {GLCanvas} = UIManager;
 invariant(GLCanvas,
 `gl-react-native: the native module is not available.
diff --git a/src/GLCanvas.captureFrame.ios.js b/src/GLCanvas.captureFrame.ios.js
index 80c2a53b862191b7f4f9dd590829a5b2dd194ba4..fac4a0da835c68aa0b4acc0564f6f9bcd1951838 100644
--- a/src/GLCanvas.captureFrame.ios.js
+++ b/src/GLCanvas.captureFrame.ios.js
@@ -1,5 +1,5 @@
-const invariant = require("invariant");
-const React = require("react-native");
+import invariant from "invariant";
+import React from "react-native";
 const {
   NativeModules: { GLCanvasManager }
 } = React;
diff --git a/src/GLCanvas.js b/src/GLCanvas.js
index 41d72a8bbea1c8161a8fb89cd0188419526445db..46969913a8f41d750ddfac934b33f7bf6f0737f5 100644
--- a/src/GLCanvas.js
+++ b/src/GLCanvas.js
@@ -1,11 +1,10 @@
-const invariant = require("invariant");
-const React = require("react-native");
-const {
+import invariant from "invariant";
+import React, {
   Component,
   requireNativeComponent,
-} = React;
-const defer = require("promise-defer");
-const captureFrame = require("./GLCanvas.captureFrame");
+} from "react-native";
+import defer from "promise-defer";
+import captureFrame from "./GLCanvas.captureFrame";
 
 const serializeOption = config =>
 config.format + ":" + config.type + ":" + config.quality;
diff --git a/src/Surface.js b/src/Surface.js
index d2afb5a065185dae1eac7ae8898216e263c51385..79b279c1bb6bc4c8bc6c7ba859fcc47ccfa2e5da 100644
--- a/src/Surface.js
+++ b/src/Surface.js
@@ -1,12 +1,13 @@
-const invariant = require("invariant");
-const {createSurface} = require("gl-react");
-invariant(typeof createSurface === "function", "gl-react createSurface is not a function. Check your gl-react dependency");
-const React = require("react-native");
-const {
+import invariant from "invariant";
+import {createSurface} from "gl-react";
+import React, {
   View,
   PixelRatio
-} = React;
-const GLCanvas = require("./GLCanvas");
+} from "react-native";
+import GLCanvas from "./GLCanvas";
+
+invariant(typeof createSurface === "function",
+"gl-react createSurface is not a function. Check your gl-react dependency");
 
 const getPixelRatio = props => props.scale || PixelRatio.get();
 
diff --git a/src/index.js b/src/index.js
index 3d35e2939828d1039f2717dba196610798eee8f6..7dcbe040cf474912badb337d9a256ff794ef1a79 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,7 +1,8 @@
-const invariant = require("invariant");
-const { Shaders } = require("gl-react");
-const Surface = require("./Surface");
-const { NativeModules: { RNGLContext } } = require("react-native");
+import invariant from "invariant";
+import { Shaders } from "gl-react";
+import Surface from "./Surface";
+import {NativeModules} from "react-native";
+const {RNGLContext} = NativeModules;
 invariant(RNGLContext,
 `gl-react-native: the native module is not available.
 Make sure you have properly configured it.