/blazor-markdown

A Blazor Markdown component that enables you to include Markdown files in your server-side Blazor apps.

Primary LanguageC#MIT LicenseMIT

Blazor Markdown

.NET Nuget Nuget

This is a fork from lanicon. As it seems, he stopped maintaining this project, so I continue.

A Blazor Markdown component that enables you to include Markdown files in your server-side Blazor apps.

Why?

Static content in Blazor means writing HTML. Yikes! Markdown source files are easier to read, write, and update when compared to HTML. Sounds good eh?

No longer will <pre><code> content be weirdly indented or heavily escaped. Gone are the days of misusing the <br> tag.

Get started

Install the NuGet package into your server side Blazor project.

PM> Install-Package BlazorMarkdownEnhanced
$ dotnet add package BlazorMarkdownEnhanced

Add the following to your _Imports.razor

@using BlazorMarkdown

Usage

Markdown file

The MarkdownFile component takes the path to a Markdown file in the FilePath parameter. The component will convert the Markdown file to HTML in place of the component.

<MarkdownFile FilePath="wwwroot/markdown-file.md" />

Tip: 💡 If you put your Markdown files outside of the wwwroot folder then you need to ensure they are copied to the output directory (select properties on the file from within Visual Studio).

MarkdownString

The MarkdownString component takes a raw markdown string with the Markdown parameter and converts it into HTML that is placed inside the component.

<MarkdownString Markdown='@MarkdownString'>

@code{
    string MarkdownString = "# Headline"
}

Additional options

Blazor Markdown uses Markdig under the hood. Markdig has different extensions that you can configure. For this reason the Pipeline property is overridable on the Markdown component.

public class MyCustomComponent : Markdown
{
    public override MarkdownPipeline Pipeline => new MarkdownPipelineBuilder()
        // Your chosen extensions here.
        .Build();
}
<MyCustomComponent FilePath="wwwroot/markdown-file.md" />

By default, Blazor Markdown uses all extensions except the BootStrap, SmartyPants and soft line as hard line breaks extensions.