webpack 2でコンパイルするときに内部ライブラリをエクスポートする

Question

私たちのライブラリの1つをwebpackを使用するように変換中です（ES5からES6にコードを移動していますが、まだES5サポートでライブラリを展開しています）。

ライブラリが内部にありません、それが使われている別のライブラリで、我々はこれを行うことができますので、現在私たちは、ソースでそれを展開：

const library = require('library'); 
const dataSource = require('library/src/datasources/fooSource'); 

しかし今、単一のファイルのエクスポートで、二行目をもはや働く私はresolve.modulesにフォルダを追加しようとしましたが、これは動作していません。

webpackの設定は、これと同じように見えますが、上記と同じことができる場合は（ただし、/src部分を削除してください）

const path = require('path'); 
const webpack = require('webpack'); 
const packageJSON = require('./package.json'); 

const CleanWebpackPlugin = require('clean-webpack-plugin'); 
const nodeExternals = require('webpack-node-externals'); 

module.exports = { 
    name: 'engine', 
    entry: { 
     'engine': ['babel-polyfill', './src/index.js'], 
     'engine-iframe': ['babel-polyfill', './src/index-iframe.js'], 
    }, 
    target: 'web', 
    devtool: 'sourcemap', 
    output: { 
    path: path.join(__dirname, 'dist'), 
    filename: '[name].js' 
    }, 
    resolve: { 
    extensions: ['.js'], 
    modules: [ 
     'node_modules', 
     path.resolve(__dirname, 'src'), 
     path.resolve(__dirname, 'src/core'), 
     path.resolve(__dirname, 'src/datasource'), 
     path.resolve(__dirname, 'src/events'), 
     path.resolve(__dirname, 'src/plugins'), 
     path.resolve(__dirname, 'src/strategies'), 
     path.resolve(__dirname, 'src/util') 
    ] 
    }, 
    externals: [nodeExternals()], 
    plugins: [ 
    new CleanWebpackPlugin('./dist'), 
    new webpack.BannerPlugin({ 
     banner: 
     `/** 
     * ${packageJSON.name} - Copyright © ${new Date().getFullYear()} 
     * Version ${packageJSON.value} 
     * ${packageJSON.homepage} 
     */ 
     `, 
     raw: true, 
     entryOnly: false 
    }), 
    ], 
    module: { 
    rules: [{ 
     test: /\.js?$/, 
     exclude: /(node_modules)/, 
     loader: 'babel-loader', 
     options: { 
     cacheDirectory: true 
     } 
    }] 
    } 
}; 

Answer 1

はあなたが本当に後にしているすべてのES2015ある場合 - > ES5 transpilation、古い構造を保持したい（と、単にその中のモジュールから奪っ）スタンドアロンのツールがで好ましいであろうと、多分バベルを使用して、この場合？

babel -d dist/ src/

Answer 2

インポート/要求するモジュールは、パスを指します。ライブラリはその動作を変更できません。唯一の方法は、バンドルされたバージョンに加えてこれらのファイルを提供することです。これを行うライブラリの大きな例はReduxで、これはsimple build stepです。それはコードを翻訳するためにbabelを使用しており、webpackの代わりにRollupをバンドルに使用していますが、コンセプトは同じです。バンドルされたファイル（通常のと縮小さ）があるdist/ディレクトリで

├─ dist 
│  ├── redux.js 
│  └── redux.min.js 
├─ es 
│  ├── applyMiddleware.js 
│ ... 
└─ lib 
  ├── applyMiddleware.js 
    ... 

： Reduxのは、以下の構造（完全なソースのためのunpkg - Reduxを参照）を発行しています。 lib/には、トランスペアレントなコードがあります。追加のツーリングなしでノードで実行されると予想され、はlib/と同じですが、lib/はrequireになりました。これで、redux/lib/applyMiddlewareなどをインポート/必要にすることができます。

あなたは必要なものを直接インポートして、使用することができるように、いくつかの新しい機能を使用したい場合は、バンドルをメインエントリポイントとして使用します。