Zenn
🦔

Nuxt2 => Nuxt3

2021/10/13に公開
Nuxt
tech

Upgrade Nuxt2 version to Nuxt3 version

If you want to create first Nuxt3 application .

You create initial application
ref is https://v3.nuxtjs.org/getting-started/installation
You shold upgrade version, and you think you want to knonw how to upgrade nuxt2 to nuxt3 . In this case , Please continue to read after the article .

Necessary package

  • @nuxtjs/composition-api
  • @nuxt/bridge@npm:@nuxt/bridge-edge

Nuxt3 safely from Nuxt2 .

remove packages

$ rm -rf node_modules
$ rm -rf package-lock.json

Chagnge package.json
package.json

- "nuxt": "^2.15.0"
+ "nuxt-edge": "latest"

Install Nuxt bridge

$ npm install -D @nuxt/bridge@npm:@nuxt/bridge-edge

Composition API

Install Nuxt composition api .

$ npm i @nuxtjs/composition-api

Enable the module .
nuxt.config.js

{
  buildModules: [
    '@nuxtjs/composition-api/module'
  ]
}

Optional .
Reason - Currently there's an issue with static site generation and async functions which means that you'll need to add time between pages being generated to allow for any async functions to resolve, if you are pre-generating any of your pages:
nuxt.config.js

{
  generate: {
    interval: 2000,
  }
}

Warning

  • We don't need nuxt3/cli => × $ npm i nuxt3

References

Discussion