From 85e65b6e75e2bd545835b6bad9057439a26932f0 Mon Sep 17 00:00:00 2001 From: JK-le-dev Date: Sat, 18 Oct 2025 14:44:28 -0500 Subject: [PATCH] fix(tailwindcss): tailwindcss works with vite, no custom theme --- package.json | 42 +++++++++++++++++++ src/App.jsx | 11 +++++ src/index.css | 14 +++++++ src/styles/theme.css | 7 ++++ vite.config.js | 9 +++++ web-app/index.html | 1 + web-app/package-lock.json | 85 +++++++-------------------------------- 7 files changed, 99 insertions(+), 70 deletions(-) create mode 100644 package.json create mode 100644 src/App.jsx create mode 100644 src/index.css create mode 100644 src/styles/theme.css create mode 100644 vite.config.js diff --git a/package.json b/package.json new file mode 100644 index 0000000..1833938 --- /dev/null +++ b/package.json @@ -0,0 +1,42 @@ +{ + "name": "codered-astra", + "private": true, + "scripts": { + "build": "vite build", + "dev": "vite", + "host": "vite host", + "format": "prettier --write \"**/*.{ts,tsx,md}\"", + "clean-dist": "find apps/ -type d -name 'dist' -print0 | xargs -r0 -- rm -r", + "clean-all": "find apps/ -type d -name 'dist' -print0 | xargs -r0 -- rm -r && find . -path ./node_modules -prune -o -name 'node_modules' | xargs rm -rf " + }, + "license": "ISC", + "dependencies": { + "@google/genai": "^1.25.0", + "@tailwindcss/postcss": "^4.1.14", + "@tailwindcss/vite": "^4.1.14", + "@vitejs/plugin-react": "^5.0.4", + "cors": "^2.8.5", + "dotenv": "^17.2.3", + "express": "^5.1.0", + "helmet": "^8.1.0", + "lucide-react": "^0.546.0", + "pg": "^8.16.3", + "react": "^19.2.0", + "react-dom": "^19.2.0", + "react-router": "^7.9.4", + "react-router-dom": "^7.9.4", + "vite-jsconfig-paths": "^2.0.1" + }, + "packageManager": ">=npm@10.9.0", + "devDependencies": { + "eslint": "^9.38.0", + "eslint-plugin-import": "^2.32.0", + "eslint-plugin-react": "^7.37.5", + "eslint-plugin-react-hooks": "^7.0.0", + "eslint-plugin-react-refresh": "^0.4.24", + "nodemon": "^3.1.10", + "prettier": "^3.6.2", + "tailwindcss": "^4.1.14", + "vite": "^7.1.10" + } +} diff --git a/src/App.jsx b/src/App.jsx new file mode 100644 index 0000000..35aab7c --- /dev/null +++ b/src/App.jsx @@ -0,0 +1,11 @@ +import React from "react"; + +function App() { + return ( +
+

Hello, world!

+
+ ); +} + +export default App; diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..f1f7c63 --- /dev/null +++ b/src/index.css @@ -0,0 +1,14 @@ +@import "tailwindcss"; + +body { + margin: 0; + background: rgba(var(--background)); +} + +@theme { + --color-primary: 15, 40, 98; + --color-secondary: 79, 95, 118; + --color-accent: 158, 54, 58; + --color-paragraph: 255, 255, 255; + --color-background: 9, 31, 54; +} diff --git a/src/styles/theme.css b/src/styles/theme.css new file mode 100644 index 0000000..e9e4594 --- /dev/null +++ b/src/styles/theme.css @@ -0,0 +1,7 @@ +@theme { + --color-paragraph: 255, 255, 255; + --color-background: 9, 31, 54; + --color-primary: 15, 40, 98; + --color-secondary: 79, 95, 118; + --color-accent: 158, 54, 58; +} diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..9632d41 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,9 @@ +import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react"; +import jsconfigPaths from "vite-jsconfig-paths"; +import tailwindcss from "@tailwindcss/vite"; + +// https://vite.dev/config/ +export default defineConfig({ + plugins: [tailwindcss(), react(), jsconfigPaths()], +}); diff --git a/web-app/index.html b/web-app/index.html index 12f80c9..ddadf4a 100644 --- a/web-app/index.html +++ b/web-app/index.html @@ -4,6 +4,7 @@ + codered-astra diff --git a/web-app/package-lock.json b/web-app/package-lock.json index 48eceeb..c8c08ce 100644 --- a/web-app/package-lock.json +++ b/web-app/package-lock.json @@ -9,6 +9,7 @@ "dependencies": { "@google/genai": "^1.25.0", "@tailwindcss/postcss": "^4.1.14", + "@tailwindcss/vite": "^4.1.14", "@vitejs/plugin-react": "^5.0.4", "cors": "^2.8.5", "dotenv": "^17.2.3", @@ -23,7 +24,6 @@ "vite-jsconfig-paths": "^2.0.1" }, "devDependencies": { - "autoprefixer": "^10.4.21", "eslint": "^9.38.0", "eslint-plugin-import": "^2.32.0", "eslint-plugin-react": "^7.37.5", @@ -1605,6 +1605,20 @@ "tailwindcss": "4.1.14" } }, + "node_modules/@tailwindcss/vite": { + "version": "4.1.14", + "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.1.14.tgz", + "integrity": "sha512-BoFUoU0XqgCUS1UXWhmDJroKKhNXeDzD7/XwabjkDIAbMnc4ULn5e2FuEuBbhZ6ENZoSYzKlzvZ44Yr6EUDUSA==", + "license": "MIT", + "dependencies": { + "@tailwindcss/node": "4.1.14", + "@tailwindcss/oxide": "4.1.14", + "tailwindcss": "4.1.14" + }, + "peerDependencies": { + "vite": "^5.2.0 || ^6 || ^7" + } + }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -1984,44 +1998,6 @@ "node": ">= 0.4" } }, - "node_modules/autoprefixer": { - "version": "10.4.21", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.21.tgz", - "integrity": "sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==", - "dev": true, - "funding": [ - { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" - }, - { - "type": "tidelift", - "url": "https://tidelift.com/funding/github/npm/autoprefixer" - }, - { - "type": "github", - "url": "https://github.com/sponsors/ai" - } - ], - "license": "MIT", - "dependencies": { - "browserslist": "^4.24.4", - "caniuse-lite": "^1.0.30001702", - "fraction.js": "^4.3.7", - "normalize-range": "^0.1.2", - "picocolors": "^1.1.1", - "postcss-value-parser": "^4.2.0" - }, - "bin": { - "autoprefixer": "bin/autoprefixer" - }, - "engines": { - "node": "^10 || ^12 || >=14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, "node_modules/available-typed-arrays": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz", @@ -3459,20 +3435,6 @@ "node": ">= 0.6" } }, - "node_modules/fraction.js": { - "version": "4.3.7", - "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz", - "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==", - "dev": true, - "license": "MIT", - "engines": { - "node": "*" - }, - "funding": { - "type": "patreon", - "url": "https://github.com/sponsors/rawify" - } - }, "node_modules/fresh": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz", @@ -5201,16 +5163,6 @@ "node": ">=0.10.0" } }, - "node_modules/normalize-range": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz", - "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", @@ -5661,13 +5613,6 @@ "node": "^10 || ^12 || >=14" } }, - "node_modules/postcss-value-parser": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", - "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", - "dev": true, - "license": "MIT" - }, "node_modules/postgres-array": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/postgres-array/-/postgres-array-2.0.0.tgz",