vue-problems

vue-problems.md

Vue.js + TSX + Storybook 구성이 불가능함

Storybook 패키지로부터 react, react-dom, emotion 패키지의 타입 정의가 컴파일에 포함되는데,
vue에 맞게 intrinsic elements, value-based elements를 타입 호환이 되도록 맞출수가 없다. storybookjs/storybook#7379

템플릿 기반 functional component의 v-for & ref 오동작

부모 컴포넌트에서 functional component엘리먼트에 v-for와 ref를 적용했을때 refInFor가 적용되지 않음.
ref에 지정한 이름의 프로퍼티에 엘리먼트 array로 저장되지 않고 v-for의 마지막 엘리먼트만 저장됨. vuejs/vue#10171 찾아봤는데 vue-template-compiler에 결함이 있다.
functional component는 경우 ref, refInfor를 외부에서 받아야 한다.
그리고 refInFor는 props, attrs가 아니기 때문에 렌더링 함수에 전달하는 Data object에 refInFor를 할당하는 별도 코드를 생성해야 하지만 이에 대한 고려가 없다.
요약하면 vue-template-compiler는 function component를 v-for로 렌더링하는 경우를 고려하지 않았다.
jsx를 사용하자.