feat: support Tailwind CSS

# Conflicts: # package-lock.json # package.json # src/transform.ts
nvh95 · Jun 13, 2022 · 5412539 · 5412539
1 parent 0ec5315
commit 5412539
Show file tree

Hide file tree

Showing 7 changed files with 701 additions and 6 deletions.
diff --git a/demo/App.tsx b/demo/App.tsx
@@ -31,6 +31,7 @@ function App() {
           This text is styled by global configured SASS
         </p>
         <p className="imported-sass">This text is styled by imported SASS</p>
+        <p className={"text-red-500"}>This text is styled by Tailwind CSS</p>
         <button
           css={css`
             padding: 32px;

diff --git a/demo/global.css b/demo/global.css
@@ -1,3 +1,8 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* TODO: Redundant. Tailwind css inserts own reset css. */
 body {
   margin: 0;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',

diff --git a/demo/setupTests.js b/demo/setupTests.js
@@ -1,3 +1,4 @@
+import '../../demo/global.css';
 import '@testing-library/jest-dom/extend-expect';
 import { jestPreviewConfigure } from '../dist/index';
 import './global.css';