storybook-addon-nuxt - GitLite

KO | EN

gitlite — search

#hacktoberfest #react #ai #llm #go #golang #machine-learning #rust #deep-learning #linux #docker #ios #openai #open-source

storybook-addon-nuxt

(★ 78)

This add-on makes it easier to set up Storybook in your Nuxt3 project.

File Explorer

Download Latest Version (.zip)

- - ci.yml
  - release.yml
- - .eslintignore
  - .eslintrc
  - .gitignore
  - .npmrc
  - .prettierrc
  - app.vue
  - nuxt.config.ts
  - package-lock.json
  - package.json
  - README.md
  - tsconfig.json
- app-component.mjs
- components.mjs
- composables.mjs
- preset.ts
.eslintignore
.eslintrc.json
.gitignore
.prettierignore
.prettierrc
.releaserc.json
package-lock.json
package.json
README.md
tsconfig.json

# Installation Guide

1. Get the code

git clone https://github.com/hirotaka/storybook-addon-nuxt

Downloads the entire project code from GitHub to your computer.

cd storybook-addon-nuxt

Moves into the project folder you just downloaded.

2. Node.js

Easy Recommended

Prerequisites

Git Needed to download the project code from GitHub.
Node.js Node.js must be installed to use npm. The LTS version is recommended.

npm install --save-dev storybook-addon-nuxt

Downloads and installs the libraries listed in package.json.

yarn add --dev storybook-addon-nuxt

Type this command into your terminal and run it.

✅ After running the command, open the address shown in the terminal (usually something like http://localhost:3000) in your browser.

Pulled directly from this repo's README.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

> **Note** \
> To use Storybook with Nuxt3, please use the nuxt-modules repository. \
> https://github.com/nuxt-modules/storybook

# Storybook Addon Nuxt

This add-on makes it easier to set up Storybook in your Nuxt3 project.

## Supported Features

- Auto Imports
- NuxtLink

Since we're still in the early stages of the project, there are several features that we still need to tackle. We're open to hearing your requests for features and will address them in the order we receive them.
Please feel free to [let us know](https://github.com/hirotaka/storybook-addon-nuxt/discussions) what you need without hesitation.

## Requirements

- Nuxt >= 3.x
- Storybook >= 7.x

## Examples

- Nuxt3 - [Source](./examples/nuxt3/)

## Getting Started

### Installation

First setup Storybook.

In your Nuxt project directory:

```
npx storybook@latest init --type vue3 --builder vite
```

Install storybook-addon-nuxt using npm:

```
npm install --save-dev storybook-addon-nuxt
```

Or yarn:

```
yarn add --dev storybook-addon-nuxt
```

Register the Addon in main.js

```
// .storybook/main.js

module.exports = {
  // other config ommited for brevity
  addons: [
    // ...
    'storybook-addon-nuxt'
    // ...
  ]
}
```