Default value set in target config property returns null in LWC JS

Question

I am trying to set a @track variable in my LWC JS using default value in target config property defined in -meta.xml. When I console.log on the target config value in JS, it returns null.

Here is my JS code snippet:

import { LightningElement, track, wire, api } from 'lwc';
import getStrategyToActivity from '@salesforce/apex/GetDelieverableWorkPlanDetail.getStrategyToActivity';

export default class Deliverable_workplandetailview_lwc extends LightningElement {
@track fieldsActivity;
@api milestoneFields;
@api recordId;

@wire(getStrategyToActivity, {
    delId : '$recordId'})
    wiredgetStrategyToActivity({error,data}){
        if(data)
{
console.log('----',JSON.stringify(data));

this.fieldsActivity = this.milestoneFields;

// this.milestoneFields returns null
console.log('>>>>>> ' + this.fieldsActivity + this.milestoneFields);

}
}

Here is the code snippet in meta xml :

<targets>
    <target>lightningCommunity__Page</target>
    <target>lightningCommunity__Default</target>
    <target>lightning__RecordPage</target>
</targets>
<targetConfigs>
    <targetConfig targets="lightningCommunity__Default">
        <property name="recordId" type="String" label="recordId" default=""/>
        <property name="milestoneFields" type="String" label="milestoneFields" default="Milestone__c,Person_Responsible__c"/>

    </targetConfig>

Thanks in advance, Yagna

Answer 1

This started working when I deleted my lwc component in the Experience site -> published the changes. Added the lwc component again on the Exp site and published it. After re-adding the lwc component, the value in this.milestoneFields showed up correctly in console.log!!