tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:Force.com CLIとsublime-lightningプライグインの使い方を勉強しました

ちょっと前にForce.com CLIの使い方を調べてみたり、sublime-lightningプライグインを試してみたりしたのですが、いろいろうまくできていないところがありました。


その辺の問題をすべて解決してくれるブログが公開されていました。

Lightning ComponentをSublime Textで開発する方法 at nkjmkzk.net


やり方がわかったのでもう一度自分の環境で試してみました。

Force.com CLIの準備

まずはForce.com CLIです。次のURLからダウンロードできます。
https://force-cli.herokuapp.com/


ダウンロードボタンがあるのでクリックすると『force』というファイルがダウンロードされます。
f:id:tyoshikawa1106:20150211122356p:plain:w300


このファイルはコマンドラインから実行するためのファイルです。ダウンロード後に次のコマンドを実行することで簡単に使えるようになるみたいです。

$ chmod 755 $HOME/Downloads/force
$ sudo mv $HOME/Downloads/force /usr/bin/


こういうコマンドはあまりよくわかっていないのでどういう意味か確認してみました。次のサイトがわかりやすかったです。

chmodコマンドの使い方 | Memo on the Web


『chmod 755』とは実行可能権限をつけるためのものでした。
もう1つの『mv』コマンドとはファイルを移動するためのものなのでダウンロードフォルダから指定の位置へforceファイルを移動してくれます。


上のコマンドを自分の環境で試してみた時のキャプチャです。
f:id:tyoshikawa1106:20150211122902p:plain


これで『$force』コマンドを実行できるようになるみたいです。


『$force -help』というように実行してみると・・・
f:id:tyoshikawa1106:20150211123953p:plain


できました!これでForce.com CLIがきちんと使えるようになりました。


Force.com CLIを使うにはGo言語が必要なので、事前にインストールしておく必要があると思います。

Force.com CLI - コマンドラインインタフェース | Salesforce Developers Japan Blog

sublime-lightningプライグインのインストール

Force.com CLIが正しく動作するようになったのでsublime-lightningプライグインのインストールを試してみます。


sublime-lightningプライグインはGitHubで公開されています。
dcarroll/sublime-lightning · GitHub


まずは次のリンク先からパッケージインストールに必要なコードをコピーしてきます。

Installation - Package Control

f:id:tyoshikawa1106:20150211124843p:plain:w300


Sublimeを開いてメニューバーのView > Show Consoleを選択します。
f:id:tyoshikawa1106:20150211125143p:plain


下側にテキストボックスが表示されるので先程のコードを貼り付けます。
f:id:tyoshikawa1106:20150211125213p:plain


・・と以前試した時はここで止まってしまったのですが、まだ次の作業が必要だったみたいです。

Sublime TextのメニューバーからTools > Command Paletteを選択し、Package Control: Install Packageを選択。

f:id:tyoshikawa1106:20150211125411p:plain


検索ボックスを利用するとすぐに見つかります。
f:id:tyoshikawa1106:20150211125518p:plain


『Lightningを検索して選択するとsublime-lightningがインストールされます。』とのことなので探してみると、いくつか表示された中にLightningがあったので選択してインストールできました。これでsublime-lightningプライグインがインストールできたみたいです。

プロジェクトの作成

Lightning開発は次のようにプロジェクトを作成すればいいみたいです。

① Sublime Textのワークスペースにディレクトリを作成
$ mkdir -p /MYPROJECT/metadata/aura

※『mkdir』とはディレクトリを作成するコマンドです。-pはパス指定だと思います。

f:id:tyoshikawa1106:20150211130251p:plain


『Permission denied』・・何かなと訳してみると「アクセス拒否」エラーでした。
確認してみると『sudo』をつけて管理者権限で実行すれば大丈夫そう。

sudo mkdir -p /MYPROJECT/metadata/aura


今度は正常に実行されファイルが作成されました。
f:id:tyoshikawa1106:20150211132105p:plain


ディレクトリの作成コマンドがどういうものが確認できたので自分の作業スペースにフォルダが作成されるように次のように変更してみます。

mkdir -p /Users/tyoshikawa1106/pg/lightning/myproject/metadata/aura


たぶんこんな感じ
f:id:tyoshikawa1106:20150211132625p:plain


無事に作成されました。
f:id:tyoshikawa1106:20150211132745p:plain

② Sublime Textを起動し、メニューバーからFile > Openを選択して作成したディレクトリを開く

f:id:tyoshikawa1106:20150211130929p:plain:w300


作成したmyprojectフォルダを選択します。
f:id:tyoshikawa1106:20150211132953p:plain:w300


こんな感じになりました。
f:id:tyoshikawa1106:20150211133032p:plain

③ ディレクトリを右クリックし、Lightning > Salesforce Loginをクリック

f:id:tyoshikawa1106:20150211133248p:plain:w300

④ ユーザ名の入力

f:id:tyoshikawa1106:20150211133414p:plain

⑤ パスワードの入力

f:id:tyoshikawa1106:20150211133553p:plain


うまくいくとこのようなメッセージが表示されるみたいです。
f:id:tyoshikawa1106:20150211133647p:plain


無事にsublime-lightningプライグインを使ってSalesforceにログインできました。


ログイン後は『myproject』フォルダではなく『aura』フォルダに対して右クリックするとCreate Appなどのメニューが使用できます。
f:id:tyoshikawa1106:20150211134021p:plain:w300


既存のファイルを読み込むには『Lightning > Fetch Lightning』を選択すればいいみたいです。
f:id:tyoshikawa1106:20150211134202p:plain:w300


Allも用意されているので一括読み込みできるようになっていました。


これでLightning関連のファイルを開くことができました!
f:id:tyoshikawa1106:20150211134416p:plain

右下でHTMLなど選択すれば見やすい色で表示できます。


なんとかsublime-lightningプライグインの使い方を覚えることができました。今までは開発者コンソールだけでしたが、SublimeTextを使って開発できるようになります。コードのキャプチャを取るときも綺麗に表示されていい感じです。