Vue-cli를 사용하여 CSS를 "dist/vue-COMPONT_NAME.js" 파일에 빌드할 수 있습니까?

Vue-cli를 사용하여 CSS를 "dist/vue-COMPONT_NAME.js" 파일에 빌드할 수 있습니까?

TLDR: 컴포넌트가 자신의 컴포넌트를 확실히 주입할 수 있는 우아한 방법을 아는 사람?<style>{...everything in ./dist/vue-COMPONENT_NAME.css}</style>단 한 번뿐인가요?SSR도 친근한가요?

지금까지 2일 이상 이 문제를 해결하기 위한 적절한 솔루션을 찾고 있습니다.대부분 빌드되지 않은 클라이언트 측 환경에서 사용되는 Vue 컴포넌트를 스크립트 태그를 사용하여 구축하고 있습니다.

<script src="https://unpkg.com/vue-COMPONENT_NAME/dist/vue-COMPONENT_NAME.js"></script>

일반적으로 링크 태그를 사용하여 스타일을 가져옵니다.

<link rel="stylesheet" href="https://unpkg.com/vue-COMPONENT_NAME/dist/vue-COMPONENT_NAME.css">

..단, 페이지에 링크 태그를 추가할 필요가 없습니다(잊어버렸을 가능성이 있습니다).이 컴포넌트는 필요한 스타일을 자동으로 페이지에 삽입할 수 있기 때문에 스타일링되지 않은 상태로 표시되지 않도록 하고 싶습니다.

이 컴포넌트는 디스플레이에 캔버스를 사용하는 그래픽스 중심 컴포넌트이며 내부 로직의 일부는 다음 컴포넌트의 분석에 기초하고 있습니다.clientBoundingRect최상위 DOM 노드의 크기 및 비율을 마운트할 때 설정하는 스타일이 필수적입니다.

또한 Nuxt를 통해 이 컴포넌트를 직접 사용할 계획이기 때문에 어떤 솔루션이 나오든 반드시 이 컴포넌트를 사용하지 않도록 해야 합니다."The client-side rendered virtual DOM tree is not matching server-rendered content."에러 메시지

지금까지 저는 이 빌드가 얼마나 저구성인지 마음에 들었습니다.vue-cli지금까지:

vue build vue-COMPONENT_NAME.vue --prod --lib VueCOMPONENT

...단, 출력은 항상 2개의 파일입니다.

./dist/vue-COMPONENT_NAME.js ./dist/vue-COMPONENT_NAME.css

의 인수 또는 설정 파라미터가 있습니까?vue-cli그 때문에 스타일이 만들어지고./dist/vue-COMPONENT_NAME.js이런 짓을 한 사람이 있나요?vue-cli?

언급URL : https://stackoverflow.com/questions/45255105/using-vue-cli-is-it-possible-to-build-the-css-into-the-dist-vue-component-na