You need to sign in to do that
Don't have an account?

Embed a web component within another web component
So I have been searching for days, to find out how to embed a Web component within another web component. I have a conditional statement that will include another web component if it evalutes to true, but I can't seem to get it to work. I get the following error when I try to deploy it:
/c/eCms_cancelModal_lwc/eCMS_CancelModal_LWC.js:0,0 : LWC1010: Failed to resolve entry for module "eCMS_CancelModal_LWC"
Listed below is a snippet of the code causing the error. Any help would be greatly appreciated.
Thanks,
Niels
WEB COMPONENT (HTML) 1
<template if:true={openmodel}>
<c-e-cms_cancel-modal_lwc source="lwc/eCMS_CancelModal_LWC"></c-e-cms_cancel-modal_lwc>
</template>
WEB COMPONENT (HTML) 2
<template>
<!--NJ call component here, so remove the following once I get it working. -->
<div class="slds-m-bottom_none slds-m-top_none" style="height: 640px;">
<section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">
<div class="slds-modal__container">
<header class="slds-modal__header">
<button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" title="Close" onclick={closeModal}>
<lightning-icon icon-name="utility:close" size="medium">
</lightning-icon>
<span class="slds-assistive-text">Close</span>
</button>
<h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">(VERSION 2) Please Enter Cancellation Justification</h2>
</header>
<div class="slds-modal__content slds-p-around_medium">
<p></p>
<lightning-input label="Justification" class="slds-size--1-of-1"></lightning-input><br/>
</div>
<footer class="slds-modal__footer">
<lightning-button label="Save" variant="brand" onclick={saveMethod}></lightning-button>
<lightning-button label="Cancel" variant="neutral" onclick={closeModal}></lightning-button>
</footer>
</div>
</section>
<div class="slds-backdrop slds-backdrop_open"></div>
</div>
</template>
WEB COMPONENT (JS) 2
import { LightningElement, track, api } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
//import { getRecord } from 'lightning/uiRecordApi';
export default class ECMS_CancelModal_LWC extends LightningElement {
@api recordId;
@track openmodel = false;
//openmodal() {
// this.openmodel = true;
//}
closeModal() {
this.openmodel = false;
}
saveMethod() {
// Navigate to a URL
this[NavigationMixin.Navigate]({
type: 'standard__webPage',
attributes: {
url: '/apex/Apttus__AgreementCancel?id=' + this.recordId
}
});
//this.closeModal();
}
}
/c/eCms_cancelModal_lwc/eCMS_CancelModal_LWC.js:0,0 : LWC1010: Failed to resolve entry for module "eCMS_CancelModal_LWC"
Listed below is a snippet of the code causing the error. Any help would be greatly appreciated.
Thanks,
Niels
WEB COMPONENT (HTML) 1
<template if:true={openmodel}>
<c-e-cms_cancel-modal_lwc source="lwc/eCMS_CancelModal_LWC"></c-e-cms_cancel-modal_lwc>
</template>
WEB COMPONENT (HTML) 2
<template>
<!--NJ call component here, so remove the following once I get it working. -->
<div class="slds-m-bottom_none slds-m-top_none" style="height: 640px;">
<section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">
<div class="slds-modal__container">
<header class="slds-modal__header">
<button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" title="Close" onclick={closeModal}>
<lightning-icon icon-name="utility:close" size="medium">
</lightning-icon>
<span class="slds-assistive-text">Close</span>
</button>
<h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">(VERSION 2) Please Enter Cancellation Justification</h2>
</header>
<div class="slds-modal__content slds-p-around_medium">
<p></p>
<lightning-input label="Justification" class="slds-size--1-of-1"></lightning-input><br/>
</div>
<footer class="slds-modal__footer">
<lightning-button label="Save" variant="brand" onclick={saveMethod}></lightning-button>
<lightning-button label="Cancel" variant="neutral" onclick={closeModal}></lightning-button>
</footer>
</div>
</section>
<div class="slds-backdrop slds-backdrop_open"></div>
</div>
</template>
WEB COMPONENT (JS) 2
import { LightningElement, track, api } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
//import { getRecord } from 'lightning/uiRecordApi';
export default class ECMS_CancelModal_LWC extends LightningElement {
@api recordId;
@track openmodel = false;
//openmodal() {
// this.openmodel = true;
//}
closeModal() {
this.openmodel = false;
}
saveMethod() {
// Navigate to a URL
this[NavigationMixin.Navigate]({
type: 'standard__webPage',
attributes: {
url: '/apex/Apttus__AgreementCancel?id=' + this.recordId
}
});
//this.closeModal();
}
}
<template if:true={openmodel}>
<c-custom-modal></c-custom-modal>
</template>
Try replace <c-e-cms_cancel-modal_lwc > with <c-e-c-m-s_cancel-modal_l-w-c></c-e-c-m-s_cancel-modal_l-w-c>
abcThing_Base and using c-abc-thing_base results in LWC1010: Failed to resolve entry for module
Is there a way to query salesforce and get the name it thinks it has?