Salesforce LWC(Lightning Web Component) Hello Worldのサンプル
環境
VSCode
操作方法
1.lwcで右クリックして SFDX: Create Lightning Web Component を選択します。
2.コンポーネント名を指定します
例helloworld
出力先ディレクトリを指定すれば完了です。
出力先ディレクトリは何も考えずにEnterを押せば force-app/main/default/lwc になります。
3.Hello world! とだけ表示するコンポーネントを作ります。 helloworld.html
<template>
<div>
Hello world!12345
</div>
</template>
<template>
<div>
Hello world!12345
</div>
</template>
<template>
<div>
Hello world!12345
</div>
</template>
4.XML(helloworld.js-meta.xml)を以下のようにします。
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>52.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
</targets>
</LightningComponentBundle>
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>52.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
</targets>
</LightningComponentBundle>
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>52.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
</targets>
</LightningComponentBundle>
5.スクラッチ組織に向けてデプロイします。
$ sfdx force:source:push -u ttwork -f