npmsvelte95% confidence\u2191 49

Cannot access 'variable_name' before initialization

Full error message
When using reactive variables by declaring them using the $: syntax, you get the following error.

Cannot access 'variable_name' before initialization

Here is the code:

App.svelte

<script>
    import { ledzep, redhotchilis } from './data.js'
    
    $: bandmembers = [...ledzep, ...redhotchilis]
    
    let namesWithA = bandmembers.filter(d => {
            if (d.indexOf('a') > 0) {               
                return true;
            }
        else {
            return false
        }
    })
    
</script>
<h2>Band Members</h2>
<ul>
{#each bandmembers as member}
    <li>{member}</li>
{/each}
</ul>

<h2>Members with "A" in their names</h2>
<ul>
{#each namesWithA as member}
    <li>{member}</li>
{/each}
</ul>

data.js

export const ledzep = ["Jimmy Page", "John Bonham", "Robert Plant", "John Paul Jones"]
export const redhotchilis = ["Anthony Kiedis", "Flea", "Chad Smith", "Josh Klinghoffer"]
Solutionsource: stackoverflow \u2197

When you assign variables using $: you cannot assign them as part of other variables declared using let, const, or var. When you do assignments using $:, you can only use them in other variables assigned using $:. In the code posted above, you need to change the following lines: let namesWithA = bandmembers.filter(d => { if (d.indexOf('a') > 0) { return true; } else { return false } }) to the following: $: namesWithA = bandmembers.filter(d => { if (d.indexOf('a') > 0) { return true; } else { return false } }) It took me a while to figure this out and just wanted to share this with any other Svelte newbies that are starting out in this new technology.

API access

Get this solution programmatically \u2014 free, no authentication.

curl https://depscope.dev/api/error/0da581f05ff61691f301f30304b6e5d27988c099df8760c5e24e5014c30a136e
hash \u00b7 0da581f05ff61691f301f30304b6e5d27988c099df8760c5e24e5014c30a136e
Cannot access &#39;variable_name&#39; before initialization — DepScope fix | DepScope