react-native-to-css v1.1.2

react-native-to-css

Converts React Native stylesheet object to a CSS text

Usage

import { ViewStyle, TextStyle, ImageStyle } from 'react-native';

export const page: ViewStyle = {
  minHeight: '100%',
  backgroundColor: '#FAFAFB',
  flex: 1,
  zIndex: 1,
};

export const list: ViewStyle = {
  marginTop: 5,
  paddingHorizontal: 15,
};
export const item: ViewStyle = {
  marginTop: 15,
};

Will be translated into

page {
  background-color: #fafafb;
  flex: 1;
  z-index: 1;
  display: flex;
}

.list {
  margin-top: 5px;
  padding: 0 15px 0 15px;
}

.item {
  margin-top: 15px;
}

When paddingVertical is encountered, it will be translated into padding-top, padding-bottom, Others include marginHorizontal, marginVertical, paddingHorizontal

export const list: ViewStyle = {
  paddingVertical: 2,
};

.list {
  padding-top: 2px;
  padding-bottom: 2px;
}

Installation

npm install --save react-native-to-css

Usage

Please follow the steps below

1、create index.js in root directory

const reactNativeToCss = require("react-native-to-css");
reactNativeToCss();

2、Put the file you want to convert in the root directory of the folder, only supported Type Script, for example test.ts

3、Execute command node index.js, When the command is completed, the corresponding file will be generated