15

I'm developing a lightning web component with org based development and I'm finding that the component isn't available in the app builder, despite (as far as I can tell) making it available in the component definition. I've attempted this with a my own component and also directly copying the "HelloWorld" Lightning component in this trailhead:

Create a Hello World Lightning Web Component

My component is pretty simple, and I'd like it to be available on the Contact record page. Here is the config on that component:

    <?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="contact_CRSProfileLayout">
    <apiVersion>45.0</apiVersion>
    <description>Use this component to display the fields from this person's related CRS Profile</description>
    <masterLabel>CRS Profile</masterLabel>
    <isExposed>true</isExposed>  
    <targets>
        <target>lightning__RecordPage</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__RecordPage">
            <objects>
                <object>Contact</object>
            </objects> 
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

I've deployed the components into my sandbox from Visual Studio Code using the "SFDX: Deploy Source to Org" command and I can see that the lighting web components are in the sandbox when I navigate to them in the admin interface (I can't confirm that they exactly match what I'm seeing in Source, but I can see the timestamp of their update is correct).

Successful deployment

However, neither of them are appearing in the ap builder. I would expect both to appear on a record page app builder and the hellowWorld component only to appear on a home page Lightning Page.

enter image description here

Are there general troubleshooting steps I should be taking?

Improve this question

5 Answers 5

Reset to default
33

You currently have the isExposed attribute set to false, it needs to be set to true for the component to be available on the targeted pages and app builder.

<isExposed>true</isExposed>

By definition:

isExposed

A Boolean value. Exposes the component in all orgs, and in Lightning App Builder and Community Builder

Improve this answer
9
  • Unfortunately, I'd already tried that (and the helloWorld component was set to Exposed = true. Unfortunately, this hasn't made any difference. I've made the change in the original question so it's clearer.
    – Bigears
    Mar 25, 2019 at 12:46
  • Did you redeploy the configuration file after making the change?
    – Jayant Das
    Mar 25, 2019 at 12:49
  • Thank you for checking, but yes - I'm clicking "SFDX: deploy Source to Org" after every change, just to see.
    – Bigears
    Mar 25, 2019 at 12:53
  • You have few different components mentioned in your question and that your original question was updated. I will recommend to start with one of the components say hello world and try to update the attribute and see if that works. There’s no other attribute which makes the component available in app builder.
    – Jayant Das
    Mar 25, 2019 at 12:59
  • Additionally just to make sure that the deployment was successful, check for message ended with exit code 0 to make sure the deployment was indeed successful.
    – Jayant Das
    Mar 25, 2019 at 13:04
15

Add targets in .js-meta.xml file of the component.

<targets>
    <target>lightning__AppPage</target>
    <target>lightning__RecordPage</target>
    <target>lightning__HomePage</target>
</targets>
Improve this answer
4
  • He already has "lightning__RecordPage" as a target in there. Can you elaborate?
    – Matt Lacey ♦
    Jul 11, 2019 at 1:59
  • This is a good answer - fixed it for me.
    – Ryan Cocuzzo
    Jul 30, 2019 at 1:08
  • This also worked for me, after toggling isExposed in Jayant's answer. Both actions were necessary to resolve my issue.
    – Marty C.
    Dec 16, 2019 at 21:37
  • Same, this works with isExposed=true
    – Scott Morrison
    Mar 6, 2020 at 19:42
6

The issue wasn't the deploy, it was me - I'm inexperienced with Visual Studio Code.

I wasn't following the correct order of actions. The local save wasn't happening, so I was repeatedly deploying a "blank" component to the server.

I've ensured that the local save is happening and the components are now showing up as expected.

Improve this answer
1

Go to componentname.meta.xml file under lwc in VS Check true attribute set to true.

If isExposed is false, the component is not exposed to Lightning App Builder or Community Builder. To allow the component to be used in Lightning App Builder or Community Builder, set isExposed to true and define at least one , which is a type of Lightning page.

Improve this answer
1
  • 1
    Please provide a reference for material that's copied from the documentation so that others can benefit from the context. This answer is really the same as that already posted by Jayant Das, but we have lots of unsolved questions that could benefit from your knowledge of LWC.
    – David Reed ♦
    May 9, 2019 at 13:34
0

I ran into this issue in a Trailhead Playground when I had the setting "salesforcedx-vscode-core.experimental.deployRetrieve" set to true in vscode. Whenever I deployed it would say the component updated. After I turned it off and deployed, it said it was Added (new), and was then visible.

I've used this feature in other orgs plenty of times so I don't know if this issue is specific to Trailhead Playgrounds

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .