본문 바로가기

전체 글

(94)
[Vue.js] Cannot start nuxt: Cannot find module 'pinia/dist/pinia.mjs' 오류 해결하기 Nuxt3에서 Pinia를 사용하기 위해 Nuxt 가이드 문서에 따라 @pinia/nuxt 모듈을 설치하고 예제 코드를 추가하였더니 아래와 같은 오류가 발생하였다. ERROR Cannot start nuxt: Cannot find module 'pinia/dist/pinia.mjs' 해결 방법npm install pinia  추가로 pinia 설치하다가 오류가 나는 경우가 있다.npm error code ERESOLVEnpm error ERESOLVE could not resolve 이 경우 아래 코드를 package.json 파일에 추가해준다.{ ... "overrides": { "vue": "latest" }, ...}  Referencehttps://nuxt.com/modules/p..
[Vue.js] Nuxt3 nuxti18n Invalid linked format error 해결하기 nuxti18n을 적용하면서 기존에 vue-i18n에서 사용하던 국제화 텍스트들을 그대로 가져왔더니 아래와 같은 오류가 발생하였다. 오류 내용[오후 7:20:48] ERROR [unplugin-vue-i18n] Invalid linked format (error code: 10) in /Users/user/Documents/workspace/vue3/i18n/en-US.json target message: abcd1234@naver.com target message path: email 1 | abcd1234@naver.com  오류 원인이유는 vue-i18n의 v9 버전 부터 @가 vue-i18n에서 사용하는 특수문자 중 하나가 되었고, nuxti18n은 vue-i18n v9 버전을 포함..
[Vue.js] Cannot find module 'vue-framework'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? Vetur(2792) 오류 해결하기 Vue3 + Nuxt3 기반의 프로젝트를 신규 구축하다가 외부 라이브러리를 추가하려고 하였더니 아래와 같은 오류가 발생하였다. 문제 코드 오류 내용Cannot find module 'vue-framework'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? Vetur(2792) 해결 방법tsconfig.json 파일에 아래 코드를 추가한다.{ ... "compilerOptions": { "moduleResolution": "node" }}
[Vue.js] Nuxt3에서 Less 전역으로 적용하기 / 변수 전역으로 사용하기 Nuxt3 프로젝트를 신규로 구축하면서 색상 등을 정의해 놓은 공통 Less 파일을 전역으로 설정하고 싶었다.Nuxt 공식 문서와 구글 검색을 통해 적용하다 보니 적용이 되었다!이제 각 SFC 스타일 마다 import를 하지 않아도 Less 공통 변수를 불러서 사용이 가능해졌다.export default defineNuxtConfig({ ... vite: { css: { preprocessorOptions: { less: { additionalData: '@import "~/assets/less/common.less";', }, }, }, },});  Referencehttps://nuxt.com/docs/getting-start..
[Vue.js] Nuxt3에서 외부 라이브러리 적용하기 Nuxt3 기반의 프로젝트를 신규 구축하면서 사내에서 직접 개발한 라이브러리 적용이 필요했다.기존의 Vue 프로젝트에서는 app.use()를 사용하였었는데, Nuxt3에서 어떻게 적용해야할까 찾아보았다. 적용 방법nuxtApp.vueApp.use()를 사용하면 된다.  Referencehttps://nuxt.com/docs/api/composables/use-nuxt-app#vueapp