You can use react-native-css-loader width react-native-webpack-server, which can use webpack to built react-native app better.

react-native-css-loader, inspired by gulp-react-native-stylesheet-css, thanks.

$ npm install react-native --save
$ npm install react-native-css-loader --save-dev

var styles = require("react-native-css!./file.css");
// => returns react-native stylesheet object

Or within the webpack config:

// only css:
module: {
  loaders: [{
    test: /\.css$/,
    loader: 'react-native-css-loader'
  }]
}

// use stylus:
module: {
  loaders: [{
    test: /\.styl$/,
    loader: 'react-native-css-loader!stylus-loader'
  }]
}

// use sass:
module: {
  loaders: [{
    test: /\.scss$/,
    loader: 'react-native-css-loader!sass-loader'
  }]
}

// use less:
module: {
  loaders: [{
    test: /\.less$/,
    loader: 'react-native-css-loader!less-loader'
  }]
}

Any property found in your CSS will be camelCased. By default, this plugin will always output values as JavaScript Number or Boolean objects when appropriate. Values with units attached, including "em" and "px," will be output without their unit suffixes.

The following properties output different keys to satisfy React Native's requirements. Unless otherwise noted, the values for each correspond with CSS3.

• Fork this Repo first
• Clone your Repo
• Install dependencies by $ npm install
• Checkout a feature branch
• Feel free to add your features
• Make sure your features are fully tested
• Publish your local branch, Open a pull request
• Enjoy hacking <3