라이브러리 내보내기를 올바르게 수행하는 방법은 무엇입니까?

Question

webpack을 사용하여 처음으로 진출한 저는 재사용 가능한 라이브러리를 만들려고합니다. 라이브러리 클래스를 올바르게 내보내는 방법을 알 수 없습니다. 여기 내가 현재하고있는 일에 대한 일반적인 개요와 내가 만든 것을 사용하려고하는 방법이 있습니다.

나는 진입 점과 같이 있습니다

import {ClassA} from './libs/library.js'; // currently using chrome flags for testing 

하지만 알아낼 수 없습니다 : 내 응용 프로그램에서 필요로 할 때 나는 내 수업을 가져올 내장 된 라이브러리를 사용하고 싶다고

import ClassA from './classA'; 
import ClassB from './classB'; 

export {ClassA, ClassB}; 

내 webpack 빌드를위한 '출력'설정을 바꿔라. 같은

{ 
    "presets": [[ 
    "env", { 
     "targets": { 
     "browsers": "last 2 versions" 
     } 
    } 
    ]] 
} 

과 웹팩 설정 : 나는 같은 .babelrc와 바벨-ENV를 사용하고 가져 오기 이전에 표시를 통해, 내 클래스를 사용하려고 할 때

는하지만, 내가

const path = require('path'); 

export default() => ({ 
    entry: __dirname + '/src/index.js', 
    output: { 
     path: path.resolve(__dirname, './libs'), 
     filename: 'library.js', 
     libraryTarget: 'umd', 
     library: '' 
    }, 
    externals: {}, 
    module: { 
     rules: [{ 
      test: /\.js$/, 
      exclude: /node_modules/, 
      use: { 
       loader: "babel-loader" 
      } 
     },{ 
      test: /\.js$/, 
      exclude: /node_modules/, 
      use: { 
       loader: "eslint-loader" 
      } 
     }] 
    }, 
    resolve: { 
     modules: [path.resolve('./node_modules'), path.resolve('./src')], 
     extensions: ['.json', '.js'] 
    } 
}); 

를 얻을 수 오류 :

Uncaught SyntaxError: The requested module does not provide an export named 'ClassA'

누구나 내가 뭘 잘못하고 있는지 알 수 있습니까? 나는 webpack 옵션의 올바른 구성을 놓친 것 같지만 Google의 시간은 도움이되지 못했습니다.

Answer 1

Webpack에이 문제를 해결하기 위해 오랜 시간이 걸릴 것으로 보입니다 (feature request). 한편

, (이이 libraryTarget: 'umd' 옵션의 기본 동작입니다) 전역에 변수를 추가해야하는 간단한 import './classA'을 할 수 있습니다