Added in the typescript lang to the script tag SvelteKit

This commit is contained in:
Andrew Smith committed 2023-03-09 10:02:19 +00:00
1 parent 6b2e5d1af0
commit 2ba0800b59
2 files changed
+6 -6

No files matched your search

@@ -135,7 +135,7 @@ We need to create an event listener in the root `+layout.svelte` file in order c
```svelte
<!-- src/routes/+layout.svelte -->
<script>
<script lang="ts">
import { invalidate } from '$app/navigation';
import { onMount } from 'svelte';
import type { PageData } from './$types';
@@ -210,7 +210,7 @@ You can now determine if a user is authenticated on the client-side by checking
For [row level security](https://supabase.com/docs/guides/auth/row-level-security) to work properly when fetching data client-side, you need to use `supabaseClient` from `PageData` and only run your query once the session is defined client-side:
```html
<script>
<script lang="ts">
import type { PageData } from './$types';
export let data: PageData;
@@ -500,7 +500,7 @@ In order to use the Supabase library in your client code you will need to setup
```html title=src/routes/+layout.svelte
<!-- src/routes/+layout.svelte -->
<script>
<script lang="ts">
import { supabaseClient } from '$lib/db'
import { invalidate } from '$app/navigation'
import { onMount } from 'svelte'
@@ -555,7 +555,7 @@ export const load: LayoutLoad = async ({ fetch, data, depends }) => {
```svelte title=src/routes/+layout.svelte
<!-- src/routes/+layout.svelte -->
<script>
<script lang="ts">
import { invalidate } from '$app/navigation';
import { onMount } from 'svelte';
import type { PageData } from './$types';
@@ -655,7 +655,7 @@ declare global {
```html title=src/routes/profile/+page.svelte
<!-- src/routes/profile/+page.svelte -->
<script>
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data
$: ({ user, tableData } = data)
@@ -560,7 +560,7 @@ And then we can add the widget to the Account page:
```svelte title=src/routes/account/+page.svelte
<!-- src/routes/account/+page.svelte -->
<script>
<script lang="ts">
// Import the new component
import Avatar from './Avatar.svelte'
</script>