올바른 요소와 메시지 상자 스타일을 적용하는 방법은 무엇입니까?

Question

내가 만든 최소 페이지의 요소와 메시지 상자는 다음과 같습니다.

element-plus 문서에 있는 것과 비슷하게 보이길 원합니다.

저는 vite 및 ElementPlus와 함께 Vue를 사용합니다. vite 및 element plus 문서의 설정을 복사했습니다. 나는 다른 많은 요소들을 가지고 놀았고 그것들은 모두 올바르게 렌더링되었습니다. 문제를 재현할 수 있는 최소 App.vue 구성 요소:

으아악

내vite.config.js

으아악

페이지가 작습니다:

으아악

스크립트도 마찬가지입니다:

으아악

마지막은 내 꺼야 package.json:

으아악

Answer 1

"unplugin-auto-import/vite" 및 "unplugin-vue-comComponents/vite"를 사용한 경우에는 필요하지 않습니다.

Answer 2

문서에서 설명이 충분하지 않다고 생각합니다. https://element -plus.org/en-US/guide/quickstart.html

사용 시 ElMessage 或 ElMessageBox 해당 스타일을 수동으로 가져와야 할 수도 있습니다. 빠른 시작/요청 시 가져오기 섹션에서는 이에 대해 아무 것도 언급하지 않고 다른 모든 요소는 기본적으로 작동하므로 약간 혼란스럽습니다.

으아아아