Skip to content

Wiki

Nuxt Studio Tutorial

About 3 min read

1.Introduction

2.Install

2.1.Install

Open your project with VScode, and use Ctrl+~to bring up the terminal interface.

alt text

Execute in the project root directory:

npx nuxt module add nuxt-studio

This is the currently recommended installation method. It installs nuxt-studio and automatically adds the module to the Nuxt configuration.

If the following occurs during execution:

Need to install the following packages...
Ok to proceed? (y)

Inputythen press Enter.

After installation is complete, check nuxt.config.ts. Normally it should look like:

alt text

Check package.json. Normally it should be similar to:

alt text

There is no need to manually enter the version number; the version actually installed by npm shall prevail.

2.2.test

Execute:

npm run dev

The terminal typically displays:

Local: http://localhost:3000/

alt text

Open in browser:

http://localhost:3000

After successful installation, a Studio floating button should appear in the lower-left corner of the page. Click it to enter edit mode.

alt text