여행과 일상

개요pinia store 에서 vue-router 사용 시 undefined 로 인해 정상적인 동작을 하지않는 상황이 발생 사실 이건 당연한, 간단한 구조적 문제였는데.. 저와 같은 실수를 하는 사람이 없길 바라며 작성하는 게시글입니다.. 개발 환경build tool: viteframework: vue3state management: pinia 코드main.js import { createApp } from 'vue' import { createPinia } from 'pinia' import App from './App.vue' import router from './router' const app = createApp(App) app.use(createPinia()) app.use(ro..

개발환경현재 개발중인 환경은 아래와 같다front framework: vue3 (v3.2.13)build tool: vite (v3.1.9) 상황개발을 하다보면 local, dev, prod 와 같은 개발환경에 따라 다른 처리가 필요한 부분이 꼭 생기게 된다.vue3, vite 를 사용하여 개발하는 지금, 이러한 처리가 필요한 부분이 발생하여 해당 환경에 맞게 처리 후 테스트 할 환경으로 빌드를 하기 위해 아래와 같이 빌드를 실행하였다. npm run build --mode local정상적으로 진행 될 거라 생각했지만 아래와 같은 오류가 발생하였다. Error: "local" cannot be used as a mode name because it conflicts with the .local p..

화면에서 computed 속성의 값을 변경 시킬 경우 발생하는 오류와 이에 대한 해결 방법을 이야기하고자 한다.먼저, 아래의 소스를 보자. computed 값: {{ compDefaultValue }} 문구 변경  위 소스에서 문구 변경을 클릭할 경우 호출되는 increase 함수에서 this.compDefaultValue = 1 을 하는 순간 아래와 같은 오류가 발생할 것이다. vue.runtime.esm.js:619 [Vue warn]: Computed property "compDefaultValue" was assigned to but it has no setter. computed 내 에서 사용되는 속성들은 단어그대로 계산된 속성 (c..

이번에는 공통으로 사용되는 함수들을 모아 전역 변수로 선언한 후 해당 변수를 통해 함수를 호출하는 방법을 알아보도록 하겠습니다.먼저 공통 함수들을 선언하는 파일을 utils.js 라고 명명하고 아래와 같이 작성합니다.  // utils.js export default { // 숫자 외 문자삭제 후 리턴 inputNumber: (v) => { return v.replace(/[^0-9]/g, '') } } 그리고 main.js 에서 utils.js 파일을 import 후 전역 변수에 $utils 라는 이름으로 등록합니다.  // main.js import { createApp } from 'vue' import App from './App.vue' import ro..

아래는vue3 에서 script setup 방식으로 전역변수를 사용하는 예제 입니다. 전역변수 설정case 1provide 를 사용하여 전역변수를 설정하는 방법.file: main.js ... const appTitle = 'hello nobody' const app = createApp(app) .provide('$title', appTitle) .mount('#app') case 2config.globalProperties 를 사용하는 방식으로 provide 와 동일하게 vue3 에서 전역 애플리케이션 인스턴스에 속성을 추가할 수 있는 기능.file: main.js...const appTitle = 'hello nobody'const app = createApp(app)...app.con..

최근 일산에 입장료 없이 물고기를 보며 커피를 즐길 수 있는 카페가 생겨 들러보았습니다.이름은 아쿠아가든. 이곳에 대해 간략히 알려드려보도록 하겠습니다. 1. 위치 및 소개아쿠아가든은 경기도 고양시 일산에 위치한 수족관 카페로, 2024년 9월 14일에 오픈했습니다.정확한 위치는 경기도 고양시 일산서구 일중로 9 이며, 역 바로 옆에 붙어있습니다. (도보 2~3분 이내..?)아래 사진은.. 입장 시 깜빡하고 사진을 찍지 못해서 퇴장때 찍은 거라 잘 안보이는 점 양해부탁드릴게요.사진처럼 입구앞부터 건물 뒤편에 마련된 주차장을 이용할 수 있는데요, 주차 공간은 상당히 넓지만 입소문이 벌써 퍼져서인지 이곳에 갈 예정이시라면 조금 서두르는 게 좋을 것 같아요.그리고 사진에서는 잘 보이지 않지만 주차장이 아직 아..

소개 및 위치꽤 오랜만에 대구 수성구 근처를 방문하였다가 발견한 빵집인데요,이름은 BUTTER BAKE (버터베이크) 같은 건물 바로 옆에 위치한 약국에 들렀다가 빵이 너무 맛있어 보여서 들어갔는데..이거 맛있어도 너무 맛있어서 살짝, 아주 간략히 소개해보고자 합니다.(글 맨 아래에 메뉴와 가격이 있어요. 몇개 빠진 메뉴들도 있으니 참고해주세요..)위치는 대구광역시 수성구 달구벌대로 2480 1층 101호 인데요,사진처럼 1층에 엄~청 나게 크게 있기 때문에 찾는게 어렵지는 않으실 거에요.  내부매장안은 무척 넓습니다. 아니.. ‘무척 넓게 느껴지도록 했다 라고 하는게 맞을까요..?’ 넓은 공간에 이런저런것 다 갖다놔서 좁게 만든 곳을 별로 좋아하지 않는데요, 이곳은 빵, 테이블, 카운터를 적절한 위치에..

소개제주도 여행의 마지막 숙소는 여행의 마지막날이라는게 아쉬울 정도로 즐겁게 지냈던 곳이었어요.그곳은 바로 선흘아이 라는 곳입니다.   위치위치는 함덕해수욕장 근처에 있습니다. 해수욕장과 불과 5km 거리에요.정확한 주소는.. 제주시 조천읍 선흘남 4길 33 입니다.숙소 체크인 시간이 한시간 가량 남아서 함덕해수욕장을 가봤는데 해수욕하는 부분에서 조금 떨어진, 모래사장의 끝부분으로 이동하니 물이 좀 빠진 곳으로 길이나 있었고 그 길을 따라 들어가니 바닥에서 여러 바다생물들을 볼 수 있었어요.바다생물들을 잘 몰라서 그렇지만.. 고동 비슷한 것들과 또 소라게처럼 생긴 것들. 가끔 보이는것이 아니라 아예 바닥에 널려있더라구요.  예약 (+예약TIP)예약은 선흘아이 홈페이지에서 했구요, 예약이 생각보다 경쟁이 ..

1. 소개제주도에 방문하신다면 강력히 추천 해드릴 만한 숙소를 소개해 드리고자 합니다.아래 나열된 장점을 참고 하시고 원하시는게 많다면 주저없이 예약하셔도 후회없을 거라고 생각합니다.리마인드웨딩, 돌, 100일, 만삭사진 등 모든 컨셉이 가능한 컨셉 사진을 찍을 수 있다.컨셉 사진을 찍을 수 있는 스팟이 한두곳이 아니다.여러가지 아이템이 준비되어 있었으면 좋겠다. (신청하시면 있는 컨셉에 한하여 무료로 준비해주세요.)깨끗하고 깔끔하며 넓고, 정돈 된 분위기에서 편히 힐링할 수 있다.낮도 이쁜데 밤도 너무 이쁘다. 그런데 분위기도 너무 낭만적으로 다르다.자쿠지가 있어 간단한 물놀이와 함께 충분한 휴식이 가능하다.그네 및 정글짐, 아이를 위한 물품들이 준비되어있어 아이도 매우 좋아한다.해가 진 후 이쁜 조명..

소개 및 위치오늘은 경기도 포천 에 위치한 가성비 좋은 키즈풀빌라를 소개해보고자 합니다.이름은 햇살마루실우풀빌라 인데요, 네이버맵 같은 포털쪽에서 찾으실때는 햇살마루실우 라고 검색하셔야 정확히 나올거에요.지도에 나오는 정확한 주소는 경기 포천시 일동면 운악청계로1480번길 125 또는 경기도 포천시 일동면 기산리 1-43 입니다.   내외부 소개내부 - 입구 및 현관이곳은 외적으로는 조금 오래된 팬션을 보수, 개조하여 운영하고 있는 곳 같아 보였는데요, 내부는 정말 깔끔하고 아기들을 위해 신경쓴 부분들이 곳곳에 보였어요.조금 헐렁대는 문 손잡이를 돌리며 과연.. 하고 봤던 첫 인상은 정~말 좋았었던 것 같아요.아래 사진처럼 밝은, 화이트톤의 깔끔하고 널찍한. 그리고 정리된 내부가 보자마자 너무 마음에 들..