1

I am used to of 'The Welkin Suite' editor for official development. I am not frequent user of VS code. Only using VS code for personal use. Yesterday I observed weird issue while deploying LWC component to my playground org.

I did copy paste code(bikeCard component) from trailhead(below link) and it deployed but was not available in AppBuilder. https://trailhead.salesforce.com/content/learn/modules/lightning-web-components-basics/push-lightning-web-component-files

I checked the config file and change the version as well but didn't work. Then I deploy same code based from 'The Welkin Suite' and able to see component in App Builder.

Please let me know if anyone faced same issue and have solution. Otherwise I will report bug to VS code.

bikeCard.html

<template>
    <div>
        <div>Name: {name}</div>
        <div>Description: {description}</div>
        <lightning-badge label={material}></lightning-badge>
        <lightning-badge label={category}></lightning-badge>
        <div>Price: {price}</div>
        <div><img src={pictureUrl}/></div>
    </div>
</template>

bikeCard.js

import { LightningElement } from 'lwc';
export default class BikeCard extends LightningElement {
   name = 'Electra X4';
   description = 'A sweet bike built for comfort.';
   category = 'Mountain';
   material = 'Steel';
   price = '$2,700';
   pictureUrl = 'https://s3-us-west-1.amazonaws.com/sfdc-demo/ebikes/electrax4.jpg';
 }

bikeCard.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <!-- The apiVersion may need to be increased for the current release -->
    <description>Description for Bike</description>
    <masterLabel>bikeCard</masterLabel>
    <apiVersion>48.0</apiVersion>

    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>
</LightningComponentBundle>
Improve this question
7
  • 2
    Is the component set isExposed as true in the meta XML file?
    – Phil W
    Jul 23 '20 at 13:57
  • Also did you deploy the whole component? I don't use VSCode so don't know the specifics. It is always best to provide the full detail of the files you have since that makes things easier for the community to help you.
    – Phil W
    Jul 23 '20 at 13:59
  • You need to make sure that isExposed is true in the js-meta.xml file, and also that you have a valid target and targetConfig that would allow the component to be exposed in AppBuilder. See the documentation.
    – sfdcfox
    Jul 23 '20 at 14:18
  • Update question with code
    – Rachit
    Jul 23 '20 at 14:39
  • @sfdcfox :Yes, isExposed is true. I mentioned in question that same code base of bikeCard component is visible in App Builder once I deployed by 'The Welkin Suite' editor.
    – Rachit
    Jul 23 '20 at 14:42
2

If you have this "Experimental: Deploy Retrieve" setting enabled in VS Code Salesforce settings you will see this behavior of isExposed not being deployed with the component to the org, effectively hiding it.

If you have this setting enabled in VS Code, disable it.

"salesforcedx-vscode-core.experimental.deployRetrieve": true

There is an issue documented for the bug: https://github.com/forcedotcom/salesforcedx-vscode/issues/2302

enter image description here

Improve this answer
1
  • Yes, it worked.
    – Rachit
    Jul 23 '20 at 21:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.