source

WebPack 빌드 프로세스 없이 HTML 페이지에서 VueJS .vue 컴포넌트를 사용하는 방법

factcode 2022. 8. 30. 22:08
반응형

WebPack 빌드 프로세스 없이 HTML 페이지에서 VueJS .vue 컴포넌트를 사용하는 방법

레거시 서버 렌더링 프로젝트의 페이지를 만들고 있습니다.

페이지 중 하나에 "다이나믹"을 추가해야 합니다.그런 다음 vuejs CDN 스크립트를 가져와 인라인 vue 개체를 만듭니다.

var v = new Vue(... 

그런데 마음에 드는 .vue 컴포넌트가 있어서 페이지에 추가하고 싶습니다.그러나 이 컴포넌트는 WebPack Import 및 빌드 프로세스를 통해서만 추가할 수 있는 것 같습니다.

WebPack 빌드 프로세스 없이 html 페이지에서 이 컴포넌트를 사용하려면 어떻게 해야 합니까?가능할까요?

문서에서 설명하는 대로 poi를 사용할 수 있습니다.

poi build Component.vue --format cjs

vue-cli 3(베타) 및 필요한 글로벌 애드온을 사용할 수도 있습니다.

npm install -g @vue/cli
npm install -g @vue/cli-service-global
# or
yarn global add @vue/cli
yarn global add @vue/cli-service-global

vue build Component.vue

vue build --help옵션과 도움말 텍스트를 가져옵니다.그러나 애플리케이션 및 벤더 번들(vue 포함)을 사용하여 프로덕션 최소 코드를 생성합니다.

에서의 이전 빌드 명령어 사용에 대해서는 이 오래된 질문에 대한 답변도 참조하십시오.vue-cli2.8.x

언급URL : https://stackoverflow.com/questions/49906031/how-to-use-a-vuejs-vue-component-in-a-html-page-without-a-webpack-build-process

반응형