부모 빌드 툴을 사용하는 Vue 컴포넌트를 올바르게 작성하는 방법

부모 빌드 툴을 사용하는 Vue 컴포넌트를 올바르게 작성하는 방법

이 문제는 특정 빌드 툴(JSX를 사용한 컴포넌트 반응 등)에 의존하는 플러그인/컴포넌트 생태계가 있는 다른 프레임워크에도 적용될 수 있습니다.Vue는 제 사용 사례일 뿐입니다.

여러 Vue 컴포넌트를 싱글 형태로 작성했습니다..vueNPM에 게시된 파일입니다.그package.json이러한 컴포넌트 자체는 웹 팩, vue-variable, sass-variable 등을 사용하는 상위 프로젝트 내에서 기능하도록 되어 있기 때문에 이러한 컴포넌트는 종속성을 일람표시하지 않습니다.이러한 컴포넌트의 예를 다음에 나타냅니다.

이들 컴포넌트가 해당 빌드툴을 가진 부모 패키지에 의존한다고 선언하는 최선의 방법은 불분명합니다.라고는 자신할 수 없다devDependencies컴포넌트 자체에는 이들 컴포넌트에 의존하는 개발 단계가 없기 때문에 이들 컴포넌트에 적합한 장소입니다. peerDependencies더 적합한 것 같지만, 다시 말씀드리지만 이것이 제가 달성하고자 하는 것과 제대로 일치하는지 자신이 없습니다.

멋진 vue 저장소의 많은 컴포넌트를 살펴보니 전혀 쓸모가 없습니다.peerDependencies및 그devDependencies특정 컴포넌트 자체의 개발과 관련된 것으로 보입니다.

이러한 구성 요소를 작성하는 올바른 방법은 무엇입니까?마치 내가 "와 같은 것이 필요한 것 같아"peerDevDependencies".

유감스럽게도 대부분의 컴포넌트는 이미 컴파일되어 있습니다.

내 생각에 컴포넌트를 분배하는 가장 좋은 방법은 다음과 같이 쓰는 것이다.main날것.vue컴포넌트 파일입니다.

특정 도구를 사용하도록 지정하지 마십시오. 패키지를 픽업하는 개발자는 Browserify 또는 Rollup(또는 Webpack)에 관계없이 원하는 도구를 자유롭게 사용할 수 있어야 합니다.날것.vue포맷을 사용하여 컴파일 할 수 있습니다..vue컴포넌트 및 Vue 버전(물론 범위 내)을 사용할 수 있습니다.

게다가 Vue만 있으면 브라우저 내에서도 컴포넌트를 바로 사용할 수 있는 기능을 사용자에게 제공하는 것이 좋습니다.<script>의존.이를 위해 컴파일하고, 네, 다음 사항을 지정해야 합니다.Vue로서peerDependency페이지에 필요한 내용이라는 점에서요.

메타 정보를 저장할 수 있습니다.package.json브라우저 내에서 컴파일된 버전을 선택하도록 CDN에 지시하는 것은 매우 편리하기 때문에 사용자는 파일 이름이나 버전에 신경 쓰지 않고 패키지의 이름을 지정하기만 하면 됩니다.

Vue.js 컴포넌트의 소비자로서만, 빌드 의존성을 다음과 같이 지정합니다.peerDependencies가장 좋은 해결책입니다.꽤 표준적인 빌드 파이프라인을 사용하고 있습니다만, 그것들을 지정하는 것이 중요하다고 생각합니다.이는 최종 사용자가 컴파일하는 위치에 따라 엄밀하게는 DevDependency 또는 Dependency가 아닙니다.

사용하시는 것이 좋습니다."module"의 부동산package.jsonraw vue 파일 및"main"편찬된 것으로서. module자산은 표준화되고 있으며 웹 팩과 롤업은 이미 그것을 이해하고 있습니다.

자세한 내용은 멀티플랫폼 npm 패키지 기사 설정을 참조하십시오.

언급URL : https://stackoverflow.com/questions/42965304/correct-way-to-author-vue-components-that-rely-on-parent-build-tools