From df24365c9b21ff7a63cee7c8a0c825496dede8c8 Mon Sep 17 00:00:00 2001
From: Vinayak Kulkarni <19776877+vinayakkulkarni@users.noreply.github.com>
Date: Wed, 5 Jul 2023 04:20:55 +0530
Subject: [PATCH] refactor!: migration to unocss

Signed-off-by: Vinayak Kulkarni <19776877+vinayakkulkarni@users.noreply.github.com>
---
 config/index.ts            | 21 ++++++++++++--
 config/modules/index.ts    |  6 ++--
 config/modules/unocss.ts   |  6 ++++
 config/modules/windicss.ts | 11 -------
 uno.config.ts              | 39 +++++++++++++++++++++++++
 windi.config.ts            | 59 --------------------------------------
 6 files changed, 67 insertions(+), 75 deletions(-)
 create mode 100644 config/modules/unocss.ts
 delete mode 100644 config/modules/windicss.ts
 create mode 100644 uno.config.ts
 delete mode 100644 windi.config.ts

diff --git a/config/index.ts b/config/index.ts
index 57d0c79d..8353c59c 100644
--- a/config/index.ts
+++ b/config/index.ts
@@ -5,6 +5,8 @@ const app: NuxtConfig['app'] = {
   head,
 };
 
+const components: NuxtConfig['components'] = false;
+
 const css: NuxtConfig['css'] = [
   'maplibre-gl/dist/maplibre-gl.css',
   'v-mapbox/dist/v-mapbox.css',
@@ -13,7 +15,7 @@ const css: NuxtConfig['css'] = [
 ];
 
 const nitro: NuxtConfig['nitro'] = {
-  preset: 'netlify-builder',
+  preset: 'netlify',
 };
 
 const plugins: NuxtConfig['plugins'] = [
@@ -22,6 +24,11 @@ const plugins: NuxtConfig['plugins'] = [
   { src: '~/plugins/v-web-workers.ts', mode: 'client' },
 ];
 
+const routeRules: NuxtConfig['routeRules'] = {
+  // Homepage pre-rendered at build time
+  '/': { prerender: true },
+};
+
 const runtimeConfig: NuxtConfig['runtimeConfig'] = {
   public: {
     map: {
@@ -45,4 +52,14 @@ const typescript: NuxtConfig['typescript'] = {
 };
 
 export { modules } from './modules';
-export { app, css, nitro, plugins, runtimeConfig, ssr, typescript };
+export {
+  app,
+  components,
+  css,
+  nitro,
+  plugins,
+  routeRules,
+  runtimeConfig,
+  ssr,
+  typescript,
+};
diff --git a/config/modules/index.ts b/config/modules/index.ts
index a037dab9..3d471ac9 100644
--- a/config/modules/index.ts
+++ b/config/modules/index.ts
@@ -1,7 +1,7 @@
 import type { NuxtConfig } from 'nuxt/schema';
 import { plausible } from './plausible';
 import { pwa } from './pwa';
-import { windicss } from './windicss';
+import { unocss } from './unocss';
 
 const modules: NuxtConfig['modules'] = [
   // https://pinia.esm.dev/ssr/nuxt.html#nuxt-js
@@ -12,8 +12,8 @@ const modules: NuxtConfig['modules'] = [
   ['@kevinmarrec/nuxt-pwa', pwa],
   // https://github.com/nuxt-modules/plausible#setup
   ['@nuxtjs/plausible', plausible],
-  // https://windicss.org/guide/
-  ['nuxt-windicss', windicss],
+  // https://unocss.dev/integrations/nuxt
+  ['@unocss/nuxt', unocss],
 ];
 
 export { modules };
diff --git a/config/modules/unocss.ts b/config/modules/unocss.ts
new file mode 100644
index 00000000..4533dd08
--- /dev/null
+++ b/config/modules/unocss.ts
@@ -0,0 +1,6 @@
+export const unocss = {
+  attributify: true,
+  icons: true,
+  components: false,
+  shortcuts: [],
+};
diff --git a/config/modules/windicss.ts b/config/modules/windicss.ts
deleted file mode 100644
index 5b339104..00000000
--- a/config/modules/windicss.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export const windicss = {
-  analyze: {
-    analysis: {
-      interpretUtilities: false,
-    },
-    server: {
-      port: 8080,
-      open: false,
-    },
-  },
-};
diff --git a/uno.config.ts b/uno.config.ts
new file mode 100644
index 00000000..36098619
--- /dev/null
+++ b/uno.config.ts
@@ -0,0 +1,39 @@
+import {
+  defineConfig,
+  presetAttributify,
+  presetIcons,
+  presetTypography,
+  presetUno,
+  presetWebFonts,
+  transformerDirectives,
+  transformerVariantGroup,
+} from 'unocss';
+
+export default defineConfig({
+  content: {
+    pipeline: {
+      include: [
+        // the default
+        /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/,
+        // include js/ts files
+        '**/*.{js,ts}',
+      ],
+      // exclude files
+      // exclude: []
+    },
+  },
+  presets: [
+    presetUno(),
+    presetAttributify(),
+    presetIcons(),
+    presetTypography(),
+    presetWebFonts({
+      provider: 'google',
+      fonts: {
+        sans: 'Inter var',
+        mono: ['Fira Code', 'Fira Mono:400,700'],
+      },
+    }),
+  ],
+  transformers: [transformerDirectives(), transformerVariantGroup()],
+});
diff --git a/windi.config.ts b/windi.config.ts
deleted file mode 100644
index 727aac51..00000000
--- a/windi.config.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-import colors from 'windicss/colors';
-import { defineConfig } from 'windicss/helpers';
-import defaultTheme from 'windicss/defaultTheme';
-
-const extract = {
-  include: ['**/*.{vue,html,jsx,tsx,md}'],
-  exclude: ['node_modules', '.git'],
-};
-
-const theme = {
-  extend: {
-    colors: {
-      ...colors,
-      gray: colors.stone,
-      transparent: 'transparent',
-    },
-    fontFamily: {
-      sans: ['Inter var', ...defaultTheme.fontFamily.sans],
-    },
-    typography: {
-      DEFAULT: {
-        css: {
-          pre: {
-            backgroundColor: colors.stone[200],
-          },
-        },
-      },
-      DARK: {
-        css: {
-          pre: {
-            backgroundColor: colors.stone[800],
-          },
-        },
-      },
-    },
-  },
-};
-
-const plugins = [
-  require('windicss/plugin/filters'),
-  require('windicss/plugin/forms'),
-  require('windicss/plugin/aspect-ratio'),
-  require('windicss/plugin/line-clamp'),
-  require('windicss/plugin/scroll-snap'),
-  require('@windicss/plugin-scrollbar'),
-  require('@windicss/plugin-animations'),
-  require('windicss/plugin/typography')({
-    dark: true,
-    rtl: true,
-    className: 'prose',
-  }),
-];
-
-export default defineConfig({
-  darkMode: 'class',
-  extract,
-  theme,
-  plugins,
-});