feat(preset-theme-default): compile SCSS to CSS

docs/guide/components/list.md

@@ -84,7 +84,7 @@ Use `a-list-items-pill` to create pill shaped list items. It just modifies some
 
 ## CSS Variables
 
-`AList` comes with various CSS variables to customize the UI according to your need. You can check them in this [file](https://github.com/jd-solanki/anu/blob/main/packages/anu-vue/src/presets/theme-default/scss/index.scss).
+`AList` comes with various CSS variables to customize the UI according to your need. You can check them in this [file](https://github.com/jd-solanki/anu/blob/main/packages/preset-theme-default/src/scss/index.scss).
 
 <!-- 👉 API -->
 ## API

docs/guide/getting-started/installation.md

@@ -72,7 +72,7 @@
     import 'anu-vue/dist/style.css'
 
     // default theme styles
-    import '@anu-vue/preset-theme-default/dist/styles.scss'
+    import '@anu-vue/preset-theme-default/dist/styles.css'
 
     // Using `app.use(anu)` will register all the components globally
     createApp(App)

packages/preset-theme-default/build.config.ts

@@ -1,4 +1,5 @@
 import fs from 'fs-extra'
+import scss from 'rollup-plugin-scss'
 import { defineBuildConfig } from 'unbuild'
 
 export default defineBuildConfig({
@@ -19,5 +20,13 @@ export default defineBuildConfig({
     'mkdist:done': () => {
       fs.copyFileSync('src/scss/index.scss', 'dist/styles.scss')
     },
+    'rollup:options': (ctx, rollupOptions) => {
+      rollupOptions.plugins = rollupOptions.plugins || []
+      if (Array.isArray(rollupOptions.plugins)) {
+        rollupOptions.plugins.push(scss({
+          output: 'dist/styles.css',
+        }))
+      }
+    },
   },
 })

packages/preset-theme-default/package.json

@@ -9,6 +9,7 @@
       "import": "./dist/index.mjs",
       "require": "./dist/index.cjs"
     },
+    "./dist/styles.css": "./dist/styles.css",
     "./dist/styles.scss": "./dist/styles.scss"
   },
   "main": "./dist/index.cjs",
@@ -49,6 +50,7 @@
     "@types/fs-extra": "^9.0.13",
     "@unocss/core": "^0.45.30",
     "@unocss/reset": "^0.46.5",
-    "fs-extra": "^11.0.0"
+    "fs-extra": "^11.0.0",
+    "rollup-plugin-scss": "3"
   }
 }

packages/preset-theme-default/src/index.ts

@@ -4,6 +4,8 @@ import { rules } from './rules'
 import { shortcuts } from './shortcuts'
 import { variants } from './variants'
 
+import './scss/index.scss'
+
 interface PresetOptions {
   shortcutOverrides?: Exclude<Preset['shortcuts'], undefined>
 }