vue-cli-service에서 빌드된 Vue 구성 요소를 가져올 수 없음

vue-cli-service에서 빌드된 Vue 구성 요소를 가져올 수 없음

나는 Vue에서 꽤 처음이고 아마 내 문제는 사소한 것일 것이다.

해야 할 일:

NPM 프라이빗 레포에 넣을 수 있는 Vue 컴포넌트를 생성하여 bundle.js 파일과 같은 파일로 다른 프로젝트로 Import하고 싶다.

TLDR:

vue-cli-service build --target lib/wc에 의한 vue 구성 요소 빌딩을 가져올 수 없습니다.내가 가지고 있는 silimar의 컴포넌트를 수입하고 있다."export 'HelloWorld' was not found in '../node_modules/hello-world'

롱 버전:

나는 할 수 있는 한 많은 질문들과 프로젝트들을 했다.모든 프로젝트는 추가 변경 없이 vue-cli에 의해 구축됩니다.

• 1. 새 기본 프로젝트 생성vue create hello-world
• 2. 디폴트로는 여기 첫 번째 컴포넌트가 있습니다.src/component/HelloWorld이 예에서는 내보내는 컴포넌트입니다.
• 3. vue-cli-service를 사용하여 내보내기 가능한 파일을 만듭니다.

• 3a.vue-cli-service build --target lib --name vue-test ./src/components/index.js여기서 index.display는

  import Vue from 'vue';
  import HelloWorld from './HelloWorld.vue';
  
  const Components = {
      HelloWorld,
  };
  
  Object.keys(Components).forEach((name) => {
      Vue.component(name, Components[name]);
  });
  
  export default Components;
  

• 3b. 또는 직접 vue 파일vue-cli-service build --target wc --name vue-test 'src/components/HelloWorld.vue'

양쪽 시나리오에서vue-cli-service에 대한 파일을 생성합니다./dist폴더와 이 파일이 맞다고 믿고 싶다.

두 시나리오 모두 이 컴포넌트를 다른 vue 프로젝트로 Import할 수 없습니다.import {HelloWorld} from 'path/to/folder/or/file';또는require('path/to/folder/or/file')번들 파일이 멤버를 내보내지 않은 것 같습니다.

내가 뭘 잘못하고 있지?사용하다build --target wc또는build --target lib?

---

이 문제를 재현하기 위해 새 앱을 만들지 않으려면 https://github.com/okosowski/vueTest에서 repo를 다운로드할 수 있습니다(프로젝트 시작 시 vue cli 사용).

1. git clone
2. npm install
3. npm run build-bundle-lib또는npm run build-bundle-lib
4. npm link또는 기존 vue 프로젝트에 파일을 복사하기만 하면 됩니다.
5. Import/표시하려고 하다HelloWorld

아무쪼록 잘 부탁드립니다!!!고마워요.

---

노드 v10.14.2

npm 6.4.1

vue-Cli 2.9.6(3.3.0에서도 동일)

https://github.com/okosowski/vueTest/blob/master/package.json의 기타 사용 버전

vue-cli를 사용하여 Vue 구성 요소를 빌드하고 테스트하는 동안 동일한 문제가 발생했습니다.다행히 GitHub의 vue-cli issue tracker에 버그로 보고하여 해결책을 찾을 수 있었습니다.common.js 파일에는 아무런 문제나 버그가 없는 것으로 판명되었습니다.

아무튼...즉, Import하려는 기존 프로젝트에서 심볼링크를 해결할 수 없습니다(npm 링크를 사용하면 이렇게 됩니다).문제를 해결하려면 Import할 프로젝트의 루트 폴더에 있는 vue.config.js에 다음 항목을 추가해야 합니다.

// vue.config.js
module.exports = {
    chainWebpack: config => config.resolve.set('symlinks', false)
}

이게 도움이 됐으면 좋겠다.자세한 내용은 다음 링크를 참조하십시오.

vue-cli Tracker의 문제 보고서
웹 팩 설정: resolve.symlinks

언급URL : https://stackoverflow.com/questions/54097888/cant-import-vue-component-built-by-vue-cli-service