Babel 6で「30分間React入門…」をやるために

2016/01/02

javascript

t f B! P L
A JavaScript library for building user interfaces | Reactはやっていますね。RIA製品で(ベンダーの対応に)うんざりしている人は、Reactに限らず、いろいろなフレームワークなりライブラリなり見てみるといいですよ。

出遅れた感じがするので、 es6 - 2015年、キャッチアップをさぼっちゃった人の為のReactプロジェクト入門 - Qiita をみて、まずはチュートリアルをやってみた。次のお薦めは 30分間React入門「いいねボタン」作成チュートリアルのようなので、やってみたところ、Babel · The compiler for writing next generation JavaScriptが6になって記事の通りでは動かないので、いくつかメモ。

必要ツール

下記のように追加インストール。
npm install babel-loader babel-core babel-preset-es2015 babel-preset-stage-0 --save-dev
npm install babel-preset-react --save-dev

webpac.config.js

下記のように変更。


楽天で探す
楽天市場
にほんブログ村 IT技術ブログへ

人気の投稿

ブログ アーカイブ

自己紹介

開発からSREにクラスチェンジしました。

アフィリエイト

  • 当ブログ「Hiroaki's blog」は、amazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。
  • 当ブログでは、第三者配信による広告サービスを利用しています。このような広告配信事業者は、ユーザーの興味に応じた商品やサービスの広告を表示するため、当サイトや他サイトへのアクセスに関する情報 (氏名、住所、メール アドレス、電話番号は含まれません) を使用することがあります。このプロセスの詳細やこのような情報が広告配信事業者に使用されないようにする方法については、ここをクリックしてください。
  • アクセストレードアフィリエイトプログラムに参加しています。
  • A8.netアフィリエイトプログラムに参加しています。
  • バリューコマースアフィリエイトプログラムに参加しています。
  • もしもアフィリエイトプログラムに参加しています。

プライバシーポリシー

当サイトにアクセスされる場合、IPアドレスなどの情報または閲覧状況に関するデータが機械的に生成され、場合によっては個人情報と関連付けられる可能性があります。プライバシー保護に関する適用法に準じて、これらの通信および閲覧に関するデータを収集、処理、および利用することがあります。
当サイトにアクセスされる場合、非個人情報(ブラウザの種類、OSの種類、ドメイン名、訪問数、平均滞在時間、ページ・ビューなど個人を特定できない情報)が自動収集される場合があります。当サイトのパフォーマンスやコンテンツを改善する目的で、これらの情報を利用する場合があります。
アフィリエイトでは成果を把握するためにcookie等を利用しています。それ以外の目的で使用されることはありません。詳しくは各社のページにて確認してください。
本サイトに掲載する情報に関しては、正しいものを提供することを務めていますが、掲載内容から、いかなる損失や損害などの被害が発生しても、当ブログでは責任を追いかねます。

QooQ