レポート

Vue.jsの進化を感じるカンファレンス――Vue Fes Japan 2018

この記事を読むのに必要な時間:およそ 4 分

単一ファイルコンポーネントの世界

Rahul Kadyan氏の「A deep dive into SFC Compilation」は,SFC(Single File Components,単一ファイルコンポーネント)についてのプレゼンテーションです。

Vue.jsのSFCは次のような優れた特徴を持っています。

  • 1ファイル1コンポーネント
  • スコープ付きスタイルによる衝突回避
  • 言語選択の自由度
  • カスタムブロックの導入
  • 事前コンパイル
  • 静的最適化
  • 再利用性

Reactのテンプレート言語であるJSXと比較したときに次のような特徴があり,使いやすさに優れています。

template JSX
HTMLベース JavaScriptベース
宣言的 柔軟
最適化してくれる 難しい(マイナスポイント)

テンプレートと生成されるコードを見せ,実際にどうやって関数に展開されるかをわかりやすく解説します。コンパイラが最適化のために何を行っているか,v-preなどコンパイラー処理をスキップする方法,i18n(国際化)処理を挟む方法などコンパイラーの柔軟性を示します。

最後にはコンパイラープロセスの一連の流れと利用されるプラグインを一覧で紹介するなど,SFCの処理がより深く理解できる内容でした。

Kadyan氏,セッション後は多くの質問が集まった

Kadyan氏,セッション後は多くの質問が集まった

Rahul Kadyan氏の発表スライド
URL:https://znck.surge.sh/

Vue CLI v3の進化

Guillaume Chau氏の「Vue CLI 3 and its Graphical User Interface 」では,新しくなったVue CLIについて発表します。Vue CLI 3系は2系から大きな進化を遂げました。

Chau氏,Vue CLI UIを実演しながら解説

Chau氏,Vue CLI UIを実演しながら解説

Vue CLI 2系(vue init)には問題が多くありました。テンプレートが多すぎ,Scaffoldingしかしてくれない,各種ライブラリのアップグレードが困難といったものです。

これらをふまえて,Vue CLI v3.0は6ヵ月以上をかけて0から作り直しました。アーキテクチャベースからプラグインベースへ刷新されています。vue initにかわるvue create,ゼロコンフィグ(設定なし)でのビルド,プラグインのアップデートのしやすさなどを兼ね備えます。

Vue CLIはCLIツールとしてのアクセスしやすさを意識しつつ,ただのCLIにとどまらない強力な機能を持ち合わせています。代表的なものがVue CLI UIです。なんとVue CLIをGUIで操作できます。

CLIツールをGUI化することで,各種情報がより見やすく,親切なものになります。実演しつつ。UIの数多くの機能,UIベースでページ構成をいじったり,プラグインを導入したり,ダッシュボードで情報を一括で表示したりできることを解説してくれました。国際化対応もしているため日本語UIも選択できるようになります。

プロジェクトのプラグイン管理画面

プロジェクトのプラグイン管理画面


ここまで紹介した他にも,各種セッションが人気を集めていました。Nuxt.js 2.0については作者(共同クリエイター)が来日していたため,特に盛況なセッションの1つでした。

カンファレンス本体はもちろん,アフターパーティーでの参加者同士の情報交換なども活発で,Vue.js初の国内カンファレンスは大盛況のうちに終わりました。

乾杯の音頭をとるYou氏と川口氏

乾杯の音頭をとるYou氏と川口氏

スポンサーセッションで自著『Vue.js入門』を紹介するLINE 喜多氏

スポンサーセッションで自著『Vue.js入門』を紹介するLINE 喜多氏

本稿ではVue Fes Japan実行委員会がCC0で公開した写真を利用しています。

著者プロフィール

野田大貴(のだだいき)

株式会社技術評論社、雑誌編集部所属。主な業務は書籍の編集。

Twitter:@nodawep