React Native

In React Native because CSS itself cannot be used.

Based on the SACSS core naming convention, we have another NPM package for you to use.

$ npm i @sacss/react-native

使用

import React from 'react';

import {Text, View, ImageBackground, Image} from '@sacss/react-native';

import mImg1 from "./assets/1.jpg";

import mImg2 from "./assets/2.jpg";

export default function App() {

return (

<View bc="#f5f5f5" pt={100} ph={30} h="100%">

<View mb={16} aic>

<Image br={32} w={64} h={64} source={mImg1}/>

</View>

<Text c="#ffffff" p={16} bc="#4c5fe2" tac mb={16}>Hello world!</Text>

<ImageBackground source={mImg2} mb={40}>

<View bc="rgba(255,255,255,.8)">

<Text fs={40} lh={100} tac fwb c="#4c5fe2">Hello Again!</Text>

</View>

</ImageBackground>

</View>

);

};

@sacss/react-native It's same like SACSS naming rules, only replaced by a more flexible key={value} form, click me see more.