Nuxt 3 + NaiveUI + Codestyle Starter

Live

Look at the Nuxt 3 and Naive UI documentation to learn more.

Tools and commands:

1. ESLint

# check .ts,.js,.vue
npm run lint:eslint

# fix
npm run fix:eslint

2. Prettier

# check .
npm run lint:prettier

# fix
npm run fix:prettier

3. Stylelint

# check .scss,.vue
npm run lint:stylelint

# fix
npm run fix:stylelint

4. Check All

npm run lint

5. Fix All

npm run fix

6. Commitizen. Using git-cz

npm run ct

5. Husky .husky/pre-commit

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run lint:fix

6. Husky .husky/pre-push

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

# npm run build

UI

1. Fonts vfonts npm

// assets/styles/main.scss

@forward 'vfonts/Lato.css';
@forward 'vfonts/FiraCode.css';

2. Icons @vicons/ionicons5 xicons

<!-- Usage -->
<script
  lang="ts"
  setup
>
  import { CubeOutline as CubeOutlineIcon } from '@vicons/ionicons5'
  import { NIcon } from 'naive-ui'
</script>

<template>
  <n-icon>
    <cube-outline-icon />
  </n-icon>
</template>

Development Server

Start the development server on http://localhost:3000

yarn dev

Production

Build the application for production:

yarm build

Locally preview production build:

yarn preview

Check out the deployment documentation for more information.