こんにちは、私はそこにあるすべてのリソースのためにここに来ることを余儀なくされています。外部ヘルパーでEs6のGrunt、Babelセットアップ
バベルのサイトだけでなく、すべての単一の投稿には、十分な情報が不足しています。
私はバベルのフォーラムで答えを出さないようにしました。
私はプロトタイプのライブラリをEs6に変換しようとしていて、可能な限り最もコードのないコードに変換しようとしています。だからbloaty重複したコードを生成し、可能であればbloaty requirejsと何かを生成するbrowserify。
私はバラバラとバベルを使ってプロジェクトを作成しようとしましたが、バベルのドキュメントに従って外部ヘルパープラグインを設定しました。
関連するヘルパーコードを含めることができず、インポートモジュールコードを完全に含めることができません。
すなわちAバベル設定などの
{
options: {
sourceMap: false,
presets: ['es2015'],
"plugins": ["external-helpers"]
},
dist: {
files: {
'build/<%= package.name %>.js': ['src/<%= package.name %>.js']
}
}
}
メインのプロジェクトファイルは、エクスポートが余分なコードの下に配置されているかのようにモジュールのコードは次のようになります
import Button from './ui/buttons/Button';
などの輸入がそのために生成されています。
export default class ShareButton {}
モジュールまたはヘルパーオブジェクトが含まれているのこの
Object.defineProperty(exports, "__esModule", {
value: true
});
require('babel-core/external-helpers');
var _Button = require('./ui/buttons/Button');
var _Button2 = babelHelpers.interopRequireDefault(_Button);
なしソースのような出力を生成します。
私は外部ヘルパーに対処する方法のために懸命に検索し、それがすなわち別のファイルにインポートする
babel-external-helpers -l createClass > src/helpers.js
を必要なだけのヘルパー関数を生成するには、このような何かを持っているが、任意のリソースがに関して示唆これはプロジェクトにインポートする方法までは行かない。
トランスフォームランタイムプラグインを使用すると、無効にすることができない大量のポリフィルが生成されるため、バグがあり、必要なものにはあまり役に立ちません。
"plugins": [
["transform-runtime", { "polyfill": false, "regenerator": false }]
]
私がbrowserify/babelifyを使用すると、ロイヤルな混乱を招き、コードを複製します。
設定などの
{
options: {
"transform": [["babelify", {
"presets": ["es2015"],
"plugins": ["external-helpers"],
sourceMap: false
}]]
},
dist: {
files: {
'build/<%= package.name %>.js': ['src/<%= package.name %>.js']
}
}
}
が不足している外部のヘルパーでも、このようなコードを生成し、ヘルパーに関係のないコードを重複しました。すなわち
Object.defineProperty(exports, "__esModule", {
value: true
});
生成されたファイルのすべてのモジュール内にあります。私はすべてのファイルの一番下に、次のようにクラスをエクスポートする場合
export default class {}
重複コードが
のようなbloatyのラッピングコードが含まれていないファイルサイズの点ではvar _class = function _class() {
babelHelpers.classCallCheck(this, _class);
};
exports.default = _class;
のように生成されます
},{}],2:[function(require,module,exports){
すべてのプロトタイプクラスのファイルをまとめて1つのファイル内のファイルは勝者です。
ライブラリーを移植しますが、似たようにして、1つのファイルにまとめてください。
うまくいけば、これは簡潔であり、簡単な解決策があります。
FYIのブラウザでは、タブと4つのスペースを理解できません。コードブロックが機能するように私のエディタでこの投稿を編集しなければなりませんでした。 `` `` `のような他の場所のようなマークアップを持つといいでしょうか？
ありがとうございました。
今私はヘルパーを手動で生成し、それを縮小して生成されたバベルのビルドに連結する必要があると考えました。すなわち バベル-外部ヘルパー-l createClass、classCallCheckは、継承、interopRequireDefault、possibleConstructorReturn>は、具体的にこれらをインポートすると、自動的に構築され得る方法を把握しようとすると を../../lib/babel/helpers.js。 ファイルを不必要に大きくするので、polyfill全体を生成するtransform-runtimeプラグインにはバグがあるようですが、それほど有用ではありません。 –