Nuxt.js와 vuetify.js 그리고 Typescript를 이용한 jest 설정은 생각보다 손이 많이 갑니다. 하지만 초기 설정만 하면되는데, 매번 까먹어서 검색하기가 귀찮으니 다들 이 게시글을 즐겨찾기 하시거나, Whale 브라우저를 사용중이시라면 스크랩북에 추가하시죠! 진행해야할 사항은 간단하게 정리해보자면 JEST 설치 Typescript 설정 Vuetify 선언 설정 Test 생각보다 별로없군요 JEST 설치 Nuxt.js를 설치할때 npx create-nuxt-app 을 이용하여 설치하면 JEST를 쉽게 설치할 수 있습니다. // npx create-nuxt-app npx create-nuxt-app test 이때 jest를 포함하게되면 jest와 관련된 package들이 추가되고, scr..

https://gmyankee.tistory.com/325@Nuxt.js/storybook에 vuetify.js 적용하기https://gmyankee.tistory.com/324 Nuxt.js에 Storybook 적용하기 https://storybook.nuxtjs.org/setup Introduction @nuxtjs/storybook lets you integrate Storybook with NuxtJS with a single command. storyb..gmyankee.tistory.com지난 2020.10.05에 같은 내용으로 작성하였는데, 우리의 개발속도가 너무 빠른 storybook 성님께서 Major 버전이 업데이트되어 해당글이 참고용밖에 되지않는 무쓸모 글이 되어 고인글이 되어버렸습니..

https://gmyankee.tistory.com/324 Nuxt.js에 Storybook 적용하기 https://storybook.nuxtjs.org/setup Introduction @nuxtjs/storybook lets you integrate Storybook with NuxtJS with a single command. storybook.nuxtjs.org Nuxtjs에 Storybook을 설치하고 컴포넌트를 동적으.. gmyankee.tistory.com Nuxt.js에 Storybook 적용하기에 이어서 Vuetify.js를 적용하는 방법을 공식문서에서는 언급하지 않고 이렇게 저렇게 하면 돼! 라고만 설명을 해주고 있습니다. https://storybook.nuxtjs.org/manual..

https://storybook.nuxtjs.org/setup Introduction @nuxtjs/storybook lets you integrate Storybook with NuxtJS with a single command. storybook.nuxtjs.org Nuxtjs에 Storybook을 설치하고 컴포넌트를 동적으로 적용 관리하면서 UX/UI 디자이너와 기획자와 의사소통을 편리하게 해주는 컴포넌트단위의 문서화 방식으로 기존에 React와 Next.js를 우선 해주다가 Vue와 Nuxt.js가 추가 되었었는데 기존 Vue 설치방법이 굉장히 더럽고 추악하고 냄새나고 설치가 귀찮았는데 지금은 매우 편해져서 정리해보고자 합니다. 목차 Storybook 설치 Storybook 작성 방법 Storyb..

Nuxt JS에서 Fontawesome을 사용할 때 붙이는 방법은 다양하게 존재합니다. 저는 Plugin으로 만들어서 사용하는데 보통 새로운걸 만들때 초기 환경 셋팅시에만 작성하니 번번히 까먹어서 결국 블로그에 포스팅하게 되었네요. 먼저 설치를 위해 사용환경 서버 및 클라이언트에는 NPM이 설치되어 있어야합니다. yarn을 사용하시는분들도 있는데 저는 yarn을 안써봐서... 명령어는 npm이 yarn으로만 바뀌는걸로 알고 있어요! npm이 준비되었다면, 다음과 같이 fortawesome에 fontawesome-free를 설치합니다. npm i --save @fortawesome/fontawesome-free 설치가 끝나면 nuxt.js 프로젝트내 plugins 폴더에 파일을 새로만들어줍니다. # plu..