TypeScript 썸네일형 리스트형 Vue3 + vite 에 Typescript 적용하기 vue2 프로젝트에서 vite 로 바꾸고, vue3 로 마이그레이션 까지 한 상태에서 typescript를 적용하기 위한 그 과정들을 적어봤습니다.보통 vue 프로젝트 생성 시 초기 설정에서 ts 를 선택할 수 있어서 큰 어려움이 없을겁니다.기본 베이스가 js 인 프로젝트에서 ts 를 설치하여 js와 함께 통합하여 쓸 수 있게 설정하기 위해 공식홈페이지, 블로그 등을 찾아보며 공부해봤습니다. 🁢 Typescript install & 컴파일 설정npm install typescriptyarn add typescript package.json 에 설치된 모습 npm install --save @types/nodeyarn add @types/node package.json 에 설치된 모습 npm .. 더보기 [Vue.js] Vue 프로젝트, ESLint, Prettier (+typescript) 설정하기! Vite 로 생성했던 프로젝트 구조를 설명하고, ESLint, Prettier 를 설정해보도록 하겠습니다. 팀원들이 모두 동일한 텍스트편집기를 사용하지 않을 수 있으므로 ESLint + Prettier 를 결합하여 프로젝트 설정 파일로 관리하는 것을 추천. 프로젝트 구조 ⏦├── node_modules│ └── ...├── public│ └── favicon.ico├── src│ ├── App.vue│ ├── assets│ │ ├── base.css│ │ └── logo.svg│ ├── components│ │ ├── HelloWorld.vue│ │ ├── TheWelcome.vue│ │ ├── WelcomeItem.vue│ │ └──.. 더보기 [typescript] any VS unknown 🁢 anyScript 는 이제 그만 프로젝트의 tsconfig.json 파일에서 compilerOptions 에서 [참고: https://www.typescriptlang.org/tsconfig] noImplicityAny 는 any 라는 타입이 의도치않게 발생할 경우 에러를 띄워주는 설정이다 즉, true 로 설정할 경우 any 로 추론될 수 있는 타입을 명시적으로 지정해줘야 한다. 하지만 feature 를 개발하다보면 시간에 쫓기거나 혹은 귀찮아서 타입 지정시 any 를 남발하게 되는데... 'any' 타입은 타입스크립트의 타입 체크를 완전히 무시하게 만들어 준다. 'any' 타입의 변수에는 어떤 종류이 값이든 할당할 수 있으며, 그 변수를 사용하여 어떤 작업을 수행해도 타입스크립트 컴파일러는 오류를.. 더보기 실무에서 테스트 환경 적용기 [cypress, vue] 👁️🗨️ 테스트를 도입하게 된 배경 현재 회사에서 개발하고 있는 택시회사 erp 시스템이 규모가 꽤 커졌다. ERP 시스템인 만큼 급여시스템을 다루고 많은 택시회사들을 다루게 되다보니 관리포인트도 커지게 되었다. 분리되어 있는 페이지에서 다른 페이지에 서로 영향이 가는 기능도 많기 때문에 거기에 사용자가 복잡함을 느끼지 않는지, flow 에 방해가 되거나 혼돈을 주지 않는지, 등등을 고려해서 테스트해야한다. 복잡한 비즈니스 로직을 어떻게 하면 빠르고 안정성을 보장할 수 있을까 라는 고민도 커지게 되었고 이슈픽스에 더더욱이나 테스트 환경이 필요하게 되었다. + 팀원들의 PR리뷰하는데 시간도 많이 걸린다... 즉, 테스트하는데 시간을 단축시켜보자! ➿ 왜 E2E? snapshot test, unit tes.. 더보기 이전 1 다음
