diff --git a/rsbuild/react-tailwindcss-v4/.gitignore b/rsbuild/react-tailwindcss-v4/.gitignore new file mode 100644 index 00000000..38d7344c --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/.gitignore @@ -0,0 +1,13 @@ +# Local +.DS_Store +*.local +*.log* + +# Dist +node_modules +dist/ + +# IDE +.vscode/* +!.vscode/extensions.json +.idea diff --git a/rsbuild/react-tailwindcss-v4/README.md b/rsbuild/react-tailwindcss-v4/README.md new file mode 100644 index 00000000..37b1dd33 --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/README.md @@ -0,0 +1,29 @@ +# Rsbuild Project + +## Setup + +Install the dependencies: + +```bash +pnpm install +``` + +## Get Started + +Start the dev server: + +```bash +pnpm dev +``` + +Build the app for production: + +```bash +pnpm build +``` + +Preview the production build locally: + +```bash +pnpm preview +``` diff --git a/rsbuild/react-tailwindcss-v4/package.json b/rsbuild/react-tailwindcss-v4/package.json new file mode 100644 index 00000000..671179af --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/package.json @@ -0,0 +1,23 @@ +{ + "name": "rsbuild-react-tailwindcss-v4", + "private": true, + "version": "1.0.0", + "scripts": { + "dev": "rsbuild dev --open", + "build": "rsbuild build", + "preview": "rsbuild preview" + }, + "dependencies": { + "react": "^18.2.0", + "react-dom": "^18.2.0", + "tailwindcss": "4.0.0-alpha.9" + }, + "devDependencies": { + "@rsbuild/core": "^0.5.1", + "@rsbuild/plugin-react": "^0.5.1", + "@tailwindcss/postcss": "4.0.0-alpha.9", + "@types/react": "^18.2.47", + "@types/react-dom": "^18.2.18", + "typescript": "^5.3.0" + } +} \ No newline at end of file diff --git a/rsbuild/react-tailwindcss-v4/postcss.config.ts b/rsbuild/react-tailwindcss-v4/postcss.config.ts new file mode 100644 index 00000000..c2ddf748 --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/postcss.config.ts @@ -0,0 +1,5 @@ +export default { + plugins: { + "@tailwindcss/postcss": {}, + }, +}; diff --git a/rsbuild/react-tailwindcss-v4/rsbuild.config.ts b/rsbuild/react-tailwindcss-v4/rsbuild.config.ts new file mode 100644 index 00000000..c9962d33 --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/rsbuild.config.ts @@ -0,0 +1,6 @@ +import { defineConfig } from '@rsbuild/core'; +import { pluginReact } from '@rsbuild/plugin-react'; + +export default defineConfig({ + plugins: [pluginReact()], +}); diff --git a/rsbuild/react-tailwindcss-v4/src/App.css b/rsbuild/react-tailwindcss-v4/src/App.css new file mode 100644 index 00000000..86eba45f --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/src/App.css @@ -0,0 +1,8 @@ +@import "tailwindcss"; + +body { + margin: 0; + color: #fff; + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + background-image: linear-gradient(to bottom, #020917, #101725); +} diff --git a/rsbuild/react-tailwindcss-v4/src/App.tsx b/rsbuild/react-tailwindcss-v4/src/App.tsx new file mode 100644 index 00000000..977c00ca --- /dev/null +++ b/rsbuild/react-tailwindcss-v4/src/App.tsx @@ -0,0 +1,14 @@ +import "./App.css"; + +const App = () => { + return ( +
+ Start building amazing things with Rsbuild. +
+