feat: init cssConfig

Author: coderz-w

README.md

@@ -1,36 +1 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
-
-## Getting Started
-
-First, run the development server:
-
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
-
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
-
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
-
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
-
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+blog

eslint.config.cjs

@@ -7,7 +7,7 @@ const reactHooks = require('eslint-plugin-react-hooks');
 const { resolve } = require('path');
 module.exports = [
   {
-    ignores: ['node_modules/**', '.next/**', './eslint.config.cjs', '.gitignore','analyze/**'],
+    ignores: ['node_modules/**', '.next/**', './eslint.config.cjs', '.gitignore', 'analyze/**','plugins/**/*'],
   },
   {
     files: ['**/*.{js,jsx,ts,tsx}'],

next.config.mjs

@@ -1,13 +1,12 @@
 /** @type {import('next').NextConfig} */
-import NextBundleAnalyzer from '@next/bundle-analyzer'
+import NextBundleAnalyzer from '@next/bundle-analyzer';
 
 let nextConfig = {};
 
-if(process.env.ANALYZE === 'true'){
+if (process.env.ANALYZE === 'true') {
   nextConfig = NextBundleAnalyzer({
     enabled: true,
-  })(nextConfig)
+  })(nextConfig);
 }
 
-
 export default nextConfig;

package.json

@@ -14,12 +14,21 @@
     "analyze": "set ANALYZE=true && set BUNDLE_ANALYZE=browser && npm run build"
   },
   "dependencies": {
+    "@egoist/tailwindcss-icons": "^1.8.1",
+    "@iconify-json/material-symbols": "^1.2.4",
+    "@iconify-json/mingcute": "^1.2.1",
     "@next/bundle-analyzer": "^14.2.15",
     "@types/prettier": "^3.0.0",
+    "daisyui": "^4.12.13",
     "next": "14.2.15",
+    "postcss-js": "^4.0.1",
     "prettier": "3.3.2",
     "react": "^18",
-    "react-dom": "^18"
+    "react-dom": "^18",
+    "tailwind-scrollbar": "^3.1.0",
+    "tailwind-variants": "^0.2.1",
+    "tailwindcss-animate": "^1.0.7",
+    "tailwindcss-animated": "^1.1.2"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.4.1",
@@ -57,7 +66,7 @@
   "nextBundleAnalysis": {
     "budget": 358400,
     "budgetPercentIncreaseRed": 20,
-    "minimumChangeThreshold":102400,
+    "minimumChangeThreshold": 102400,
     "showDetails": true
   }
-}
+}

plugins/tw-css-plugin.js

@@ -0,0 +1,24 @@
+// https://github.com/tailwindlabs/tailwindcss-intellisense/issues/227#issuecomment-1462034856
+// cssAsPlugin.js
+const postcss = require('postcss');
+const postcssJs = require('postcss-js');
+const { readFileSync } = require('node:fs');
+
+require.extensions['.css'] = function (module, filename) {
+  const cssAsPlugin = ({ addBase, addComponents, addUtilities }) => {
+    const css = readFileSync(filename, 'utf8');
+    const root = postcss.parse(css);
+    const jss = postcssJs.objectify(root);
+
+    if ('@layer base' in jss) {
+      addBase(jss['@layer base']);
+    }
+    if ('@layer components' in jss) {
+      addComponents(jss['@layer components']);
+    }
+    if ('@layer utilities' in jss) {
+      addUtilities(jss['@layer utilities']);
+    }
+  };
+  module.exports = cssAsPlugin;
+};