web-dev-qa-db-ja.com

ES6モジュールを連結するにはどうすればよいですか？

ES6モジュールを連結するにはどうすればよいですか？

var foo = 2; // This would normally be scoped to the module.
export function Bar() {}

// ...concatenate...

import { Bar } from 'javascripts/bar' //This file no longer exists in the concatenated scenario.
export function Bam() {}
javascriptmoduleecmascript-6es6-modules
22
52d6c6af

ES6モジュールを内部的に使用しない単一のJavaScriptファイルを作成して、今日のブラウザー/ノードで使用できるようにする場合は、 Esperanto （完全な開示、私は ' mプロジェクトのメンテナ）。これにより、すべてのファイルを連結するバンドルを作成できますwithout browserifyやwebpackなどを使用する場合と同じようにローダーを使用します。これにより、通常、コードが小さくなり（ローダーなし）、デッドコードの除去が向上し（Google Closure CompilerやUglifyJSなどのミニファイアを使用する場合）、JSインタープリターが結果をより適切に最適化できるためパフォーマンスが向上します。

使用例を次に示しますが、次の点に注意してください エスペラントをワークフローに統合するためのツールがたくさんあります ：

var fs = require( 'fs' );
var esperanto = require( 'esperanto' );

esperanto.bundle({
  base: 'src', // optional, defaults to current dir
  entry: 'mean.js' // the '.js' is optional
}).then( function ( bundle ) {
  var cjs = bundle.toCjs();
  fs.writeFile( 'dist/mean.js', cjs.code );
});

この例は、 ES6モジュールのバンドルに関するwikiページ から抜粋したものです。

4
Brian Donovan

http://webpack.github.io を見て、それをbabelと組み合わせることをお勧めします。

あるいは、babelだけでそれを行うことができます：

https://babeljs.io/docs/usage/cli/

2
Brian Demant