- Notifications
You must be signed in to change notification settings - Fork0
Nuxt layer with default personnal configs. Strongly inspired by Nuxt UI but with UnoCSS.
License
NotificationsYou must be signed in to change notification settings
tcastanie/nuxt-bego-ui
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Nuxt layer with default personnal configs. Strongly inspired byNuxt UI but withUnoCSS. The aim is to be able to kickstart myvery serious projects quickly.
Warning
🚧 Work in progress 👷
Add the dependency toextends innuxt.config.ts:
// nuxt.config.tsexportdefaultdefineNuxtConfig({extends:'github:tcastanie/nuxt-bego-ui',})
@formkit/auto-animate@iconify-json/mingcute@nuxt/eslint@unocss/core@unocss/nuxt@vueuse/core@vueuse/nuxteslintnuxtunocssvue
pnpm i -D @formkit/auto-animate @iconify-json/mingcute @nuxt/eslint @unocss/core @unocss/nuxt @vueuse/core @vueuse/nuxt eslint nuxt unocss vue
To reexport the layer config:
// uno.config.tsimportconfigfrom'./.nuxt/uno.config.mjs'exportdefaultconfig
To modify/extend it:
// uno.config.tsimport{mergeConfigs}from'unocss'importconfigfrom'./.nuxt/uno.config.mjs'exportdefaultmergeConfigs([config,{// your overrides}])
Add your rules ineslint.config.mjs. See more oneslint.nuxt.com
Example
app.vue:<template><BegoHeadertitle="Nuxt bego UI"/><NuxtPage/><BegoFooter/></template>
pages/index.vue:<template><BegoPage><BegoH1>Hello there!</BegoH1></BegoPage></template>
Overridable defaultapp.config.ts:
exportdefaultdefineAppConfig({bego:{headerHeight:'4rem',},})
Make sure to install the dependencies
pnpm install
Then start the development server of the.playground folder, onhttp://localhost:3000
pnpm run dev
Start the dev server of thewebsite folder, onhttp://localhost:3000
pnpm run dev:web