Nuxt modules / buildModules 란? 사용법

반응형

Nuxt 에서 modules와 buildModules 속성이 있습니다.

 

modules

Nuxt에서 모든 기능을 제공하면 매우 복잡하고 어려워서, 사용자가 프로젝트별로 모듈을 추가 할 수 있습니다.

modules에서 정의한 모듈은 Nuxt가 부팅될때 순차적으로 실행이 됩니다.

 

nuxt.config.js 에서 modules 옵션을 설정할 수 있습니다.

export default defineNuxtConfig({
  modules: [
    // Simple usage
    '@nuxtjs/eslint-module',

    // With options
    ['@nuxtjs/eslint-module', { /* module options */ }]
  ]
})

 

 

buildModules

nuxt v2.9 이후로 buildModules 속성이 추가 되었습니다.

 

buildModules 속성은 개발 중에서만 모듈을 추가할 수 있어서

개발 시 build 속도를 올려주고 node_modules의 크기를 줄여 줍니다.

 

modules에 정의된 모듈은 package.json 에서 dependency에 설정이 되어있어야하고

buildModules에 정의된 모듈은 devDependecy에 설정되어야 합니다.

 

export default {
  buildModules: ['@nuxtjs/eslint-module']
}

 

 

Nuxt 홈페이지에 다양한 모듈이 안내 되어있습니다.

https://nuxt.com/modules

 

Modules · Nuxt

Comprehensive UI toolkit for Vue.js and Nuxt.js that empowers you to build amazing user interfaces with ease. With Vunix, you can leverage the power of popular utility-first CSS frameworks like Tailwind CSS, Unocss, WindiCss, or use your own custom CSS cla

nuxt.com

 

728x90
반응형