ホーム » テックブログ – Tech Blog » Lightning Web Components入門（4）Salesforce CLI

Lightning Web Components入門（4）Salesforce CLI

March 20, 2019 Naoki Kitaarashi

こんにちは、アピリオ北嵐です。LWC入門（3）で説明しましたように、Lightning Web Components（以下、LWCと記述）の開発は Salesforce CLI を使って行います。今回はこのCLI（コマンドライン・インターフェース）にスポットを当ててみたいと思います。Salesforce CLIは従来はAPIでのみ提供されていたSalesforceサーバーに対する様々な機能をコマンド形式で実行できる環境であり、Winter’18で正式にリリースされました。CLIを使うことで下記のようなことが実現できます（Spring'19時点）。

  • 開発およびテスト環境の作成
  • ソースコードの同期
  • テストの実行
  • アプリケーション・ライフサイクル全体の制御

今回はLWCの開発に使用するコマンドを中心に説明していきたいと思います。

Salesforce CLI はnodejsで開発されており、npm（nodesjのパッケージ管理ツール）のパッケージとしてローカル環境に導入します。Mac または Windows環境への導入手順についてはこちらを参照してみて下さい。また、コマンドは全てDXプロジェクトのルートフォルダから実行するようにしてください。

ログイン

Salesforce CLIではコマンド実行毎に明示的に認証を実行するわけではなく、一度認証を行った後は認証情報をローカル環境に保持しておき、それを参照する形でコマンドを実行します。

下記のコマンドを実行するとブラウザが開いて、いつものログイン画面が表示されますので、ご自身のSalesfroceアカウントを使ってログインして下さい。エイリアスには任意の名前を利用可能です。

sfdx force:auth:web:login -d -a alias
 -d この組織をデフォルトにする （省略可）
 -a エイリアスを指定 
 
//sandboxにログインする場合
sfdx force:auth:web:login -r https://test.salesforce.com -a aliasname

登録済みの組織を確認したい場合は下記のコマンドを使います。

sfdx force:org:list

下記のようにローカル環境に登録された組織の情報がリストアップされます。
=== Orgs
  ALIAS     USERNAME                          ORG ID              CONNECTED STATUS
  ────────  ────────────────────────────────  ──────────────────  ────────────────
            nkitaarashi@appirio.com.nmopjt    00Dp0000000DQVnEAO  Connected
  DevHub    nkitaarashi-ewfa@force.com        00DB0000000TbakMAC  Connected
  devsand   nkitaarashi-qkvp@force.com        00DB0000000EarSMAS  Connected
  testsand1 nkitaarashi@appirio.com.test      00DO00000055ySjMAI  invalid_grant

 

Salesforce組織をオープン

コマンドを使って登録済みの組織をブラウザ上で開くことができます。

sfdx force:org:open -u alias

 

Salesforce DXプロジェクトの作成

Salesforce DXによるスクラッチ組織を使った開発に加えて、LWCの開発を行う際にもDXプロジェクトの作成が必要です。下記のコマンドでローカル環境にDXプロジェクトを作成します。

sfdx force:project:create -n プロジェクト名
 ※ プロジェクト名をルートフォルダとして、フォルダとファイルが作成される

 

リソースの作成

DXプロジェクト内のローカル環境にリソース（Apexクラス、Lightningコンポーネント）を作成するには、下記のコマンドを実行します。

//Apexクラスの作成
sfdx force:apex:class:create -n クラス名 -d force-app/main/default/classes
  -n Apexクラス名
  -d 配置パス
 
//Auraコンポーネントの作成
sfdx force:lightning:component:create -n コンポーネント名 -d force-app/main/default/aura
sfdx force:lightning:event create -n コンポーネント名 -d force-app/main/default/aura 
  -n コンポーネント名
  -d 配置パス
 
//LWCの作成
sfdx force:lightning:component:create --type lwc -n コンポーネント名 -d force-app/main/default/lwc
  -n コンポーネント名
  -d 配置パス

 

リソースの送信と取得

SandboxやDeveloper組織からリソース（Apexクラス、Lightningコンポーネント）の取得・更新を行うには、下記のコマンドを実行します。いくつかの方法があります。
※ スクラッチ組織にはこれらのコマンドを使うことはできません。代わりに push/pull を使います

メタデータのタイプを指定して送信（任意のタイプを指定可）

//Apexクラスの送信
sfdx force:source:deploy -m ApexClass -u alias
 -u エイリアス名
 
//Auraコンポーネントの送信
sfdx force:source:deploy -m AuraDefinitionBundle -u alias
 -u エイリアス名
 
 
//LWCの送信
sfdx force:source:deploy -m LightningComponentBundle -u alias
 -u エイリアス名
 

フォルダを指定して送信（ファイル名の指定も可）

//ソースコードを送信
force:source:deploy -p force-app/main/default -u alias
 -p フォルダパス/ファイルパス
 -u エイリアス名
 

メタデータのタイプを指定して受信（任意の対応を指定可）

//Apexクラスの受信
sfdx force:source:retrieve -m ApexClass -u alias
-u エイリアス名
 
//Auraコンポーネントの受信
sfdx force:source:retrieve -m AuraDefinitionBundle -u alias
-u エイリアス名
 
//LWCの受信
sfdx force:source:retrieve -m LightningComponentBundle -u alias
-u エイリアス名

フォルダを指定して受信（ファイル名の指定も可）

//ソースコードを受信
force:source:retrieve -p force-app/main/default -u alias
 -p フォルダパス/ファイルパス
 -u エイリアス名

 

LWC コンポーネントの削除

Salesforceサーバー上の画面操作ではLWCコンポーネントは削除できないため、下記コマンドを使って削除します。

//xxはコンポーネント名
fdx force:source:delete -p force-app/main/default/lwc/xx -u alias
-u エイリアス名

 

バージョンのアップデート

CLIはできるだけ最新バージョンを使った方が良いので、定期的にバージョンアップしましょう。

sfdx update

 

おわりに

今回はLWC開発に使用する基本的なCLIコマンドを紹介しました。他にも様々なコマンドが提供されていますので、詳しくは公式のコマンド・リファレンスを参照してください。


■ Lightning Web Components 入門（全5回）シリーズは下記のリンクからご覧いただけます。
・ Lightning Web Components入門（1）Aura Components からLightning Web Componentsへ
・ Lightning Web Components入門（2）LWCの基本的な構成
・ Lightning Web Components入門（3）コンポーネントの実装方法
・ Lightning Web Components入門（4）Salesforce CLI
・ Lightning Web Components入門（5）応用編

 

著者について

某大手SIベンダーを退職し2015年からアピリオの一員としてクラウドの世界に身を投じているシニアエンジニアです。プロジェクトでの立場に応じて、アーキテクト、リーダー、デベロッパーと様々なロールの仕事に携わっています。1人のエンジニアとして技術の最先端に居続けることが技術者としてのこだわりです (^o^) やはりクラウドの世界は面白い！

Naoki Kitaarashi のコンテンツをもっと見る
戻る
Lightning Web Components入門（3）コンポーネントの実装方法
Lightning Web Components入門（3）コンポーネントの実装方法

今回は簡単なサンプル・コンポーネントを通して、LWCの基本的な実装方法とSalesforceサーバーからのデータの取得方法を見ていくことにします。LWCでは新たにWire Serviceというノンコーディングでサー...

次へ
Lightning Web Components入門（5）応用編
Lightning Web Components入門（5）応用編

第5回目の今回は応用編ということで、本格的なLWCの実装時に必要となるテクニックをいくつか紹介します。 コードの共有化 イベントの利用 外部ライブラリの読込み ページ遷移 トーストメッセージの表示 レコードIDの取...

アピリオまでお気軽にお問合せください

ご質問はこちら
ホームに戻る