pngwn / MDsveX

A markdown preprocessor for Svelte.
https://mdsvex.pngwn.io
MIT License
2.27k stars 96 forks source link

Paragraph tag doesn't nest within an {#if} conditional #523

Open dslatkin opened 1 year ago

dslatkin commented 1 year ago

You should be able to build the project using the dev container definition on the following commit to see the issue:

https://github.com/dslatkin/campkahagon.info/tree/be961aa7112c79a021e5efd637d0169fa9066570

Opening it in a GitHub Codespace should make it easy. Basically, the file at /src/routes/photos/+page.svelte has an issue where the source code is (essentially) this:

<script>
    import { page } from "$app/stores";

    $: albumId = $page.url.searchParams.get('album');
</script>

Current albumId is {albumId}

For photo information, click picture. For full screen, click the bottom-right
icon.

{#if !albumId}
    Select an album to continue
{/if}

But then then the following error gets thrown by Vite:

/src/routes/photos/+page.svelte:21:35 </p> attempted to close an element that was not open
/src/routes/photos/+page.svelte:21:35
 19 |  <a href="?album=7">Unknown</a></p>
 20 |  {#if !albumId}
 21 |  <p>Select an album to continue{/if}</p>
                                          ^

You can see the more colorful screenshot below:

image

My svelte.config.js is:

import { mdsvex } from 'mdsvex';
import adapter from '@sveltejs/adapter-static';
import { vitePreprocess } from '@sveltejs/kit/vite';

/** @type {import('@sveltejs/kit').Config} */
const config = {
    extensions: ['.svelte'],

    preprocess: [
        mdsvex({
            extensions: ['.svelte'],
        }),
        vitePreprocess(),
    ],

    kit: {
        adapter: adapter(),
    },
};

export default config;

I feel like it's possible I'm doing something wrong here, but I'm not sure what it would be. This is with Svelte 3 - I have yet to upgrade to Svelte 4 for this project.

pngwn commented 1 year ago

Unfortunately this is expected right now. We need a full blank line between the svelte and the markdown code in order for it to be parsed correctly.

If you add a new line before and after the paragraph text it should work.

This is one of the issues that will be be addressed in the current rewrite.