javascript - チェリー ピック エクスポートへの ES6 インポートを可能にする NPM パッケージの作成

Question

NPM パッケージをビルドするとき、Webpack、Rollup、または Browserify バンドル サイズを節約するために個々のエクスポートをチェリー ピッキングできるビルドをどのように作成しますか?

好ましい構文は次のとおりです。

import { myModuleOne, myModuleTwo } from 'my-npm-package';

または

import myModuleOne from 'my-npm-package/myModuleOne';
import myModuleTwo from 'my-npm-package/myModuleTwo';

Answer 1

ES6エクスポートを使用するだけです:

export const myModuleOne = ...
export const myModuleTwo = ...

プロパティをバンドルのパスにpackage.json設定しmoduleます。

{
  main: 'path/to/umd/bundle.js',
  module: 'path/to/es/bundle.js',
  ...
}

Rollup と webpack 2 にはツリー シェイキングがあるため、生成されたバンドルには必要なモジュールのみが含まれます。