トランスパイラ「Babel」の開発チーム、「何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」。資金難により寄付を訴え
トランスパイラ「Babel」の開発チーム、「何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」。資金難により寄付を訴え 「Babel」は、JavaScriptコンパイラもしくはトランスパイラの代表的なツールとして知られており、FacebookやSpotify、Slack、MongoDBなどさまざまな企業や開発現場で使われています。 そのBabelの開発チームが資金難になっていることを、開発の中心となっているコアチームがブログ「Babel is used by millions, so why are we running out of money?」（Babelは何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」で明らかにしています。 Babelとは、ECMAScript 15以降のいわゆるモダンなJavaScriptの構文や機能を活用して書
現代フロントエンドに欠かせないwebpackとBabelを理解しよう
Transcript ݱϑϩϯτΤϯυʹ͔ܽͤͳ͍ XFCQBDLͱ#BCFMΛཧղ͠Α͏ʂ� CVJMEFSTDPO�UPLZP����� /BNF� ����4BLJUP�.VLBJ� 5XJUUFS ����!@@TBLJUP@@� $PNQBOZ� ����$ZCP[V�JOD� ����'SPOUFOE�&YQFSU�5FBN "CPVU�NF w#BCFMͷલʹݱࡏͷ+BWB4DSJQUʹ͍ͭͯ� w#BCFMʹ͍ͭͯ� wXFCQBDLʹ͍ͭͯ� wXFCQBDL #BCFMͰ෦࣮Λ͍ͬͯ͘ "HFOEB #BCFMͷલʹݱࡏͷ+BWB4DSJQUʹ͍ͭͯ &$."4DSJQUͱ5$�� w+BWB4DSJQUʹ&$."4DSJQUͱ͍͏ݴޠ༷͕͋Δ� w͜ͷݴޠ༷ΛܾΊ͍ͯΔҕһձ͕5$�� 5FDIOJDBM�$PNNJUUFF��� � w&4��
Babel7事始め - 無理なご乗車はおやめ下さい。
最近のBebelがよくわかりません、という人向けに書いてみます。 7系 現時点で7系はBeta版となっています。公式Docは6系について書かれているので、7系を使ってみたい人には何の参考にもなりません。というか、インストールするパッケージ名がそもそも違います。 7系では以下のパッケージとプリセットから始めることになります。 @babel/core @babel/preset-env scoped packages 見慣れない命名規則に一部の人は面食らうと思いますが、見慣れないだけで標準仕様です。 プリフィックスの @ は名前空間のようなものです。その名前空間の / 下にパッケージ名やプラグイン名を付けるというような感じです。 babel-cli -> @babel/cli babel-core -> @babel/core babel-preset-env -> @babel/preset
babel-preset-env@2.0 を試した -トランスパイル環境をスケールさせていく -
こんにちは、制作部 フロントエンドエンジニアの武田です。 入社して5ヶ月経ちました。 ECMAScript の推し proposal は Cancellation API です。 今回は開発には切っても切れない Babel 、そのプリセットである babel-preset-env についてお話します。 このプリセットは Browserslist 1 の記述で compat table 2 を利用し、指定された環境にあったトランスパイルができるプリセットです。 使い方についての記事はすでに多くありますので今回は丁寧に触れません。 babel-preset-env を試す – アカベコマイリ最新版で学ぶwebpack 3入門 - ICS MEDIAピンと来ない方は、JavaScript をとりまくビルド環境のスケーリングに寄与しそう、と大きく理解していただいてよいです。 対象となりそうな人Ba
BabelでES6で書いて、webpackでビルドして、mochaでテスト書いて、power-assertでassertの出力を見やすくして、karmaで複数ブラウザのテストを自動化して、カバレッジを出力するようにした - UUUMエンジニアブログ
おはこんばんちは!! 尾藤 a.k.a. BTOです。 UUUMでは業務の効率改善に kintone を導入しようとしているのですが、kintone の機能を拡張するには Javascript でプログラムを書く必要があります。 そこで、Javascript の開発環境を構築したので、何をやったのかをまとめてみました。 具体的には、 BabelでES6で書いて、webpackでビルドして、mochaでテスト書いて、power-assertでassertの出力を見やすくして、karmaで複数ブラウザのテストを自動化して、カバレッジを出力するようにしました。 お前は何を言っているんだと思うかもしれませんが、僕も何を言っているのかわかりません。 Babel 言わずと知れた ES6 用のトランスパイルツールです。 ご存知の方も多いと思うので、詳細は割愛しますね。 Babel の導入は npm でイ
babel-preset-babili を試す - アカベコマイリ
babel-preset-env と minify の続き。前回は ES.next なコードを minify する方法として uglify-js を中心に babel-preset-babili を少しだけ試したところで終わった。今回は後者の使い方を掘り下げる。 Babel における plugin と preset babel-preset-babili は ES.next な JavaScript を ES5 以降の書式に変換する Babel 関連のツールで minify を担当。 現在の Babel 本体はランタイムに徹し、実際のコード解析や変換はランタイム上で動作する plugin により処理される。開発者は機能ごとに plugin を組み合わせることになるが、これらは膨大である。そのため直に利用せず plugin 集となる preset を選ぶほうがよいだろう。 例えば以下のような
babel-preset-env と minify - アカベコマイリ
{ "babel": { "presets": [ [ "env", { "targets": { "electron": 1.6 } } ], "react" ] }, "scripts": { "build:js-main": "browserify -t [ babelify ] ./src/js/main/Main.js --exclude electron --im --no-detect-globals --node -d | exorcist ./src/assets/main.js.map > ./src/assets/main.js", "build:js-renderer": "browserify -t [ babelify ] ./src/js/renderer/App.js --exclude electron -d | exorcist ./src/assets
babel-polyfill / babel-runtime の代わりにcore-jsを直接使うのはアリかナシか - Qiita
babel-polyfillとbabel-runtimeの使い分けに迷ったので調べた の続編・追加調査。 使い分け的なのわかったものの、未だにどうにも困りごとが多いので、更に深掘りしてみた。 それぞれのおさらい & 困りごと polyfillのページで改めておさらいしつつ、それぞれの困りごとを書いてみる babel-polyfill core-jsとregenerator-runtimeを読み込んでいる polyfillとして、windowグローバルを拡張する仕組み 困りごと 複数ファイルからロードするとthrow errorされてしまうので、うっかりしてるとハマるので気を使う 上記のような問題のため、ブラウザの場合は、別途dist/polyfill.jsなど、別管理してを読み込む。 require('babel-polyfill')の様にコードベース上から読み込むことは推奨されてない。
sprockets + rails-assetsを卒業して、npm + webpackへ移行 - ただのにっき(2016-05-19)
■ sprockets + rails-assetsを卒業して、npm + webpackへ移行 1年少々前、Webアプリのフロントエンド開発環境として暫定的にRails Assetsを使うことにしたのだけど、あれからjs界隈もしだいに落ち着いてきて*1、いろいろと勝ち組っぽいツールが決まってきた気がする。 そんなわけで、徐々にそっち方向へ移行してこうかな、と。とくにRails Assetsはサービス自体が終了の方向らしいので、まずはそのへんから。jsのパッケージマネージャとタスクランナーの勝ち組として、おれの観測範囲でみえてる感じだと: パッケージはpackage.jsonをnpmで管理するのが一番シンプル タスクランナーもnpmでいいよもう……という流れが強そう AltJSは使わずにES2015、ビルドにはWebpackとBabelの組み合わせ ってところか? 少し前に話題になった「1
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フロントエンドの技術を刷新した話し。