swc-plugin-nativewind

Swc plugin implementation of the NativeWind babel plugin.

✨ 100% coverage of test cases in NativeWind. (checkout the test cases here)

Installation

``bash
npm install swc-plugin-nativewind


or yarn


yarn add swc-plugin-nativewind
`

Usage

`ts
import { transform } from '@swc/core';

await transform(code, {
jsc: {
transform: {
react: {
runtime: 'automatic',
importSource: 'react-native-css-interop',
},
},
experimental: {
plugins: [['swc-plugin-nativewind', {}]],
},
externalHelpers: false,
},
});
`

Preview

Before

`tsx
import React, { createElement } from 'react';
import { Container, Section } from '@app/components';

export function Demo(): JSX.Element {
return (



{React.createElement('h1', null)}

{createElement('div', null)}

);
};
`

After

`js
import { jsx as _jsx, jsxs as _jsxs } from "react-native-css-interop/jsx-runtime";
import { createElementAndCheckCssInterop as __c } from "react-native-css-interop";
import React, { createElement } from "react";
import { Container, Section } from "@app/components";
export function MyComponent() {
return /#__PURE__/ _jsxs(Container, {
children: [
/#__PURE__/ _jsx(Section, {
children: __c("h1", null)
}),
/#__PURE__/ _jsx(Section, {
children: __c("div", null)
})
]
});
}
``

License

MIT