vue.config.js/nuxt.config.js에서 완성을 사용하도록 설정

※ vscode에서의 개발이 전제입니다

vue.config.js의 경우

@vue/cli 4.5.8 에서 vue create 한 환경에서 확인

Vue2/Vue3 모두 OK

vue.config.js

/**
 * @typedef { import("@vue/cli-service").ProjectOptions } Options
 * @type { Options }
 */
const option = {
  // ここに補完が効くようになる
};

module.exports = option;

↑ 이런 느낌이 될 것 같아요

nuxt.config.js의 경우

nuxt 2.14.6 및 @nuxt/types 2.14.6에서 확인

nuxt.config.js

/**
 * @typedef { import("@nuxt/types").NuxtOptions } NuxtOptions
 * @type { NuxtOptions }
 */
const option = {
  // ここに補完が効くようになる
};

export default option;

↑ 이런 느낌이 될 것 같아요

@nuxtjs/vuetify를 사용하는 경우 다음과 같이 작성하십시오.

nuxt.config.js

import colors from "vuetify/es5/util/colors";

/**
 * @typedef { import("@nuxt/types").NuxtOptions } NuxtOptions
 * @typedef { import("vuetify/types/services/presets").VuetifyPreset } VuetifyPreset
 * @type { NuxtOptions & { vuetify?: Partial<VuetifyPreset> } }
 */
const option = {
  // ここに補完が効くようになる
};

export default option;

nuxt.config.js의 참고 사항

위의 @nuxtjs/vuetify와 같이 nuxt 플러그인 설정은 스스로 유형을 정의해야하며 괜찮습니다.

요약

config 파일을 ts로 쓰는 선택도 있는 것 같습니다만, 보완이 효과가 있다면 개인적으로는 js 쪽이 부담스럽다고 생각합니다.
일부러 기억의 설정을 일일이 구그하는 것도 귀찮고요.

관련 기사

webpack.config.js에서 완성 효과를 얻으려면 - Qiita

조금 전에 썼던 녀석 (이것을 썼기 때문에 완전히 vue.config.js도 쓰고 있었다고 생각했습니다,,)