[fe-infra] Simplify Tailwind setup (#20)

* [fe-infra] Simplify Tailwind setup * Update GHA * process tailwind for all local folders
useVenice · Jan 27, 2023 · 6fe970c · 6fe970c
1 parent 12a9e8e
commit 6fe970c
Show file tree

Hide file tree

Showing 7 changed files with 54 additions and 303 deletions.
diff --git a/.github/workflows/validate-workflow.yml b/.github/workflows/validate-workflow.yml
@@ -50,9 +50,6 @@ jobs:
       - name: Run health check
         run: POSTGRES_OR_WEBHOOK_URL=noop NEXT_PUBLIC_SUPABASE_URL=noop NEXT_PUBLIC_SUPABASE_ANON_KEY=nnop node --loader tsx ./bin/venice health
 
-      - name: Generate assets required for lint
-        run: pnpm --dir ./apps/web/ run generate:css
-
       - name: Run lint
         run: pnpm run lint
 

diff --git a/apps/web/package.json b/apps/web/package.json
@@ -4,13 +4,9 @@
   "private": true,
   "scripts": {
     "build": "run-s build:*",
-    "build:css": "pnpm run generate:css --minify",
     "build:migration": "if [ \"$VERCEL_ENV\" = production ]; then pnpm --dir ../../ migration up; else echo 'Skip non-production migration'; fi",
     "build:next": "next build",
-    "dev": "run-p --silent dev:*",
-    "dev:css": "pnpm run generate:css --watch",
-    "dev:next": "next dev",
-    "generate:css": "tailwindcss -i ./global.css -o ./__generated__/tailwind.css",
+    "dev": "next dev",
     "start": "next start"
   },
   "dependencies": {
@@ -53,7 +49,7 @@
     "daisyui": "2.24.2",
     "node-loader": "2.0.0",
     "postcss": "*",
-    "tailwindcss": "3.1.8",
+    "tailwindcss": "3.2.4",
     "tailwindcss-radix": "2.5.0",
     "tilg": "0.1.1",
     "webpack": "*"

diff --git a/apps/web/pages/_app.tsx b/apps/web/pages/_app.tsx
@@ -1,4 +1,4 @@
-import '../__generated__/tailwind.css'
+import './global.css'
 
 import {useAtomValue} from 'jotai'
 import {NextAdapter} from 'next-query-params'

diff --git a/apps/web/global.css → apps/web/pages/global.css b/apps/web/global.css → apps/web/pages/global.css
@@ -1,6 +1,6 @@
-@import 'tailwindcss/base';
-@import 'tailwindcss/components';
-@import 'tailwindcss/utilities';
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
 
 @layer utilities {
   @supports (height: 100dvh) {

diff --git a/apps/web/postcss.config.js b/apps/web/postcss.config.js
@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
diff --git a/apps/web/tailwind.config.js b/apps/web/tailwind.config.js
@@ -9,8 +9,8 @@ const {VeniceTheme} = require('./styles/themes')
  */
 module.exports = {
   content: [
-    './{components,pages,screens}/**/*.{ts,tsx}',
-    '../../integrations/*/**/*.tsx',
+    './**/*.tsx',
+    '../../integrations/**/*.tsx',
     '../../packages/engine-frontend/**/*.tsx',
   ],
   theme: {