問題タブ [babeljs]

C# スタイルを導入する提案がありますasync-await。Babel.js が ES6 を ES5 にトランスパイルすることは知っていますが、async-await にトランスパイルする方法はありますES5か?

typeスクリプトタグを使用してrequirejsにJavascriptファイルをロードさせるときに、「text/ecmascript-6」または「text/babel」を使用しようとしています。どうやってやるの？

例えば

現在のブラウザーで実行できるように、babel.js が適用された ES6 用に作成されたバックボーン アプリの Qunit を使用していくつかのテストを作成する準備をしています。qunit が適切に設定され、すべてのパスが適切に指定されていることを確認するために、ES5 で記述されたバックボーン モデルを最初にテストしたところ、すべてが期待どおりに機能しました。ただし、次にbundle.js(babel.js を適用した ES6 コードの結果を含む) を my にtests/index.html含め、次のように記述しました。

ES6Model定義されていないと言っています。

質問: Qunit を使用してテストすることをより困難にする、babeljs によって変換されたコードについて何かありますか?

babel がファイルの先頭に書き込むすべての複雑な js に加えて、コードはbundle.js次のようになります。

アップデート

babel.js によって作成されたすべてのコードをというファイルbundle.jsに含め、それを他の js ファイルと同じように index.html に含めます。問題なく実行されます。そのため、他の js コードと同じようにテストできると想定しました。 . ただし、（コメンターが指摘したように）babel.jsによって作成されたコードはモジュールに含まれていることに注意する必要があります..これは、bundle.jsが後にテストしようとしているモデルで始まる方法です

アップデート

私はbrowserifyを使用して、バンドルを作成するES6コードのさまざまなファイルにbabelを適用しています。テストを実行しnpm run test、バンドルをコンパイルするには、これらの両方を試します (そのうちの 1 つは を使用しますmodules --ignore) が、どちらも機能しません。

"スクリプト": {

(アプリケーションは Backbone.js アプリです)。

これは私のカルマ設定ファイルです。これ以上の構成はありません (したがって、karma-require を含めるのは無駄だと思いますが、必要かもしれません...)

Babeljs を介して ECMAScript 6 の機能を使用できるようになったことに非常に興奮しています。特に、新しいモジュール機能を使用して、JavaScript コードをよりモジュール化したいと思っています。

これまでに書いたものは次のとおりです。

コマンドラインでbabelを介してES6からES5にこのコードをトランスパイルできることを理解しています：

しかし、HTML 内でこのコードを使用するにはどうすればよいでしょうか?

たとえば、この index.html ファイルは次のようになります。

ありがとうございました

BabelJS (以前は 6to5 と呼ばれていました) のrequire フックを使用して、es6featuresでノード アプリを実行します。

app.js6node run.jsを実行するために呼び出します。BabelJS をインストールし、es6features を使用するプロジェクトごとにrun.jsを提供する必要があります。のような呼び出しを希望します。このシステムを独立して実現するにはどうすればよいですか (Unix と Windows)?nodejs6 app.js6

私は、babel の代わりに traceur で動作する aurelia サンプル アプリを作成しようとしています。目的は、私が理解している限りでは、babebl ( https://github.com/babel/babel/issues/68 ) でサポートされていない静的メンバーを持ち、gulp を学習することです。これまでのところ、gulp ビルド タスクで babel を traceur に置き換えましたが、ビルドされますが、ブラウザーでさまざまなファンシー エラーで失敗します (たとえば、「Uncaught TypeError: Cannot read property 'addAppender' of undefined」で main.js から LogManager.addAppender を拒否します)。 . したがって、traceur コンパイル オプションの研究に飛び込む前に、経験豊富なオプションの意見を得たいと思います。

Aurelia は、少なくとも理論的には、babel の代わりに traceur を使用できるはずですか?

aurealia でカスタム コンポーネントを研究していて、理解できない奇妙な動作に出くわしました。このことを考慮：

コンポーネント: xxxaaa.html

xxxaaa.js:

app.html:

これは期待どおりに機能し、xxxxxx が表示されます。次に、コンポーネントをキャメルケース化します。

xxxAaa.html: 内容は変更されず、ファイル名のみ

xxxAaa.js:

app.html:

何も表示されませんが、ログにはエラーは含まれていません。

INFO [aurelia] Aurelia 開始 index.js:26 DEBUG [テンプレート] dist/app.html ["dist/xxxAaa"] のリソースをインポート中 index.js:26 DEBUG [テンプレート] dist/xxxAaa.html のリソースをインポート []

したがって、最初の質問は、なぜそうなのか?

更新: これは、aurelia のバグ (間違って作成されたカスタム elt を適切に報告できない) か、実際にどのように機能するかについての私の理解における大きなギャップのように見えます。バグであることを確認するか、aurelia が私の要素を黙って無視する理由を説明してください。

次に、最初の動作状態にロールバックし、xxxaaa.js を次のように変更します。

コンソール ログ エラー:

したがって、2 番目の質問が来ます - この大文字と小文字の区別の原因は何ですか? es6、babel、または aurelia ですか?

更新: ここで aurelia から、クラスが見つからないという苦情が寄せられると思いますが、間違った名前のクラスを取得して使用しようとしているようです。例外自体は非常に曖昧です ( https://github.com/babel/babel/issues/887、https://github.com/babel/babel/issues/700 ) が、それが再びケースであることを正しく理解していますか? aurelia からの貧弱なエラー報告の?

Rails フロントエンドに ES6 を使用する利点は非常に魅力的です。

Rails アプリにトピック ブランチを作成しました。これは、babelを使用して、アセット パイプラインを介して ES6 から ES5 にトランスパイルします。それはうまく機能しますが、いつものように私は技術的負債にうんざりしています。そのようなシステムを本番環境で使用したという良い/悪い報告を持っている人はいますか?

Karma-babel-preprocessorと単純な ES6 ジェネレーターを実行しようとしています。

これから、babel を使用してテスト ファイル (ES6 => ES5) を生成しました。

babel src --watch --out-dir tests

次に、実行するkarma startとエラーが発生します：

ReferenceError: regeneratorRuntime が定義されていません".

karma.conf.js の関連ビット:

github の完全なプロジェクト

矢印を含む多くの ES6 機能を使用できます。ジェネレーターには行かないでください。

gulp を使用していて、babeljs タスクで .js ファイルのフォーマットを保存したいのですが、どうすれば実行できますか?

たとえば、私は持っています：

それは次のように表されます。

これを回避する方法は？