Replies: 10 comments 24 replies
-
|
I'm using these public plugins:
I wrote my own plugins to:
I've actually just started getting into it and creating my own plugins, this change scares me... |
Beta Was this translation helpful? Give feedback.
-
|
Yeah I've looked at the plugin, but in the context of MDsveX I haven't figured out a clean way to provide the permalinks list since I don't have it until after the frontmatter for every note has been parsed. @pngwn any ideas? |
Beta Was this translation helpful? Give feedback.
-
|
Yeah, that's definitely a problem, I wish there was a good solution for this problem. I was going to try to let svelte handle that part, by using the custom components feature for wikilinks. Still not sure if that's the best idea, but it's the only one I currently have, inspired by #100 |
Beta Was this translation helpful? Give feedback.
-
|
Okay, that doesn't seem too bad. From the remark-wiki-link readme it looks like it adds |
Beta Was this translation helpful? Give feedback.
-
|
@Masstronaut I am interested in the wikilinks setup |
Beta Was this translation helpful? Give feedback.
-
|
@Madd0g how'd you get remark-toc to work? So far nothing seems to happen after adding the plugin :( |
Beta Was this translation helpful? Give feedback.
-
|
For a library documentation site I've used:
I am so far using these for my school notes site / app:
Other things I want to use in general, but haven't yet, are:
|
Beta Was this translation helpful? Give feedback.
-
|
@lukens did you find a way around junking the mdsvex parser? I'm also inclined to use directives for our docs, but like the idea of svx for some components... |
Beta Was this translation helpful? Give feedback.
-
Hi, sorry I missed this comment before. I've not found a solution for this in mdsvex. Dropping plugin support also makes me a little worried about the direction of the mdsvex project in general, so I have had a brief look at alternatives. In particular I've toyed with moving my docs site over to KitDocs, as it already implements a lot of features I want. It does however also have some aspects I'm not keen on (it's also quite broken currently, due to the SvelteKit routing updates), so I've also had a quick experiment with just using the Markdown parser from KitDocs. That showed some promise, but is also pretty entangled with a lot of the other features of KitDocs. I may end up just using a pure Markdown parser, and forgetting Svelte support in Markdown docs, or might look at adding Svelte support myself (possibly starting with a fork of KitDocs, if the licence looks suitably permissive). |
Beta Was this translation helpful? Give feedback.
-
|
So, I tried the idea of skipping directives and just using a Svelte component, but then I end up with un-parsed markdown. 😒 There must be a solution out there without having to make an ugly nesting of components and rendering. |
Beta Was this translation helpful? Give feedback.
-
|
Curious if anyone has news to share about using remark-directive with |
Beta Was this translation helpful? Give feedback.
-
@babichjacob did you checked footnotes inside table with remark-gfm? there is no issue on remark-gfm itself, I already checked and discussed with remark dev team. the code above is working fine. but why not working when its combined with mdsvex as plugin? |
Beta Was this translation helpful? Give feedback.
-
|
footnotes, slug, headings I find that MDsveX handles markdown tables already, but that (and GFM in general) are important features for me. I also use a handful of my own custom plugins to do things like:
Generally I'd say that @babichjacob seems to be doing a lot of the things I'm either already doing or planning to do in the next couple months, so +1 to all their use cases. |
Beta Was this translation helpful? Give feedback.
-
|
Can you share any amount of your content-hunting plugin(s) code? I can't decide whether to try to tackle the problem with normal JavaScript parsing text or with remark |
Beta Was this translation helpful? Give feedback.
-
|
Sure, code snippet below. I haven't yet added support for "rich" content (images, links, em/strong, code) in my flashcards, so this will not cover those cases. If you want to support those sorts of things in your flashcards, I would recommend the remark route. Parsing them by yourself is not worth the hassle IMO. If you don't intend to support those... I recommend you reconsider 😂 import visit from 'unist-util-visit';
export function mdFlashcardGrabber() {
return transformer;
}
// finds all flashcards with prompt and answer separated by :-:
// Puts the flashcards into the metadata object for later use
const transformer = (ast, vFile) => {
// Collect all the flashcards from this md file
const cards = [];
visit(ast, "paragraph", visitor);
// store the flashcards where they can be accessed
// vFile.data.fm corresponds to:
// import.meta.globEager('path/to/files/*.md')[index].metadata
vFile.data.fm.flashcards = [...cards];
function visitor(node) {
// Store the paragraph's collected text in the results.
// parts before it is identified as a flashcard go in "prompt"
// parts after it's identified as a flashcard go in "answer"
const results = { prompt: "", answer: "", flashcard: false };
// Walk the nodes in this paragraph to determine if it's a flashcard
// Build up the flashcard object as we go so that if it is one
// it doesn't need to be traversed again.
function traverseChildren(node, results) {
// Content text only exists in "text" nodes.
// For any other kind we can just check its children.
if (node.type === "text") {
if (!node.value) return;
// If the flashcard indicator was already found,
// any text after it is part of the answer
if (results.flashcard) {
results.answer += node.value;
return;
}
// Split the text by the flashcard indicator.
const text = node.value.split(':-:');
if (text.length === 1) {
// no flashcard indicator here
results.prompt += text[0];
if (node.value.includes(":_:")) {
// this node contains a multi-paragraph flashcard indicator
// For now these aren't implemented, so remove the indicator
// @@TODO: Support multi-line flashcards
console.warn("multi-line flashcard detected. Support for them has not been implemented yet.");
node.value = node.value.replace(":_:", "\n");
}
}
else {
// Remove my flashcard indicators from the rendered text
node.value = node.value.replace(":-:", " ");
if (text.length === 2) {
// Found a single flashcard indicator - this is a flashcard
results.prompt += text[0];
results.flashcard = true;
results.answer += text[1];
}
else {
// unexpected number of flashcard indicators (>1 per paragraph)
// assume it's meant to be 1
results.prompt += text[0];
results.flashcard = true;
text = [, ...text]; // remove the first element of the array
text.forEach(s => results.answer += s);
}
}
}
else {
if (node.children) {
node.children.forEach(child => traverseChildren(child, results));
}
}
}
traverseChildren(node, results);
if (results.flashcard) {
cards.push({ prompt: results.prompt, answer: results.answer });
}
}
} |
Beta Was this translation helpful? Give feedback.
-
|
Over at the Files website (https://files.community/) we use:
On my personal site (https://theonlytails.com/), I use:
|
Beta Was this translation helpful? Give feedback.
-
|
I've been looking, but haven't found it yet. But I would like to have section numbers added automatically to the headings. becomes |
Beta Was this translation helpful? Give feedback.
-
|
It should be fairly easy to write a plugin to do this, however, you can also achieve this with css (and, arguably it is a presentation consideration, so is maybe best handled by css): https://www.sqlpac.com/en/documents/html-css-auto-numbering-elements-counters.html |
Beta Was this translation helpful? Give feedback.
-
|
Haven't looked into a plugin solution but like @lukens said, this sort of CSS does the trick for me. /* auto-number headings, import this CSS in a .svx file to apply */
main > h2 {
counter-increment: h2;
counter-reset: h3, h4;
}
main > h2::before {
content: counter(h2);
margin-right: 10pt;
}
main > h3 {
counter-increment: h3;
counter-reset: h4;
}
main > h3::before {
content: counter(h2) '.' counter(h3);
margin-right: 10pt;
}
main > h4::before {
content: counter(h2) '.' counter(h3) '.' counter(h4);
margin-right: 10pt;
}The only potential downside is that since the numbers are added in |
Beta Was this translation helpful? Give feedback.
-
|
that plugin is also not maintained at all and has a dependency with severe vulnerabilities. |
Beta Was this translation helpful? Give feedback.
-
|
I have a few custom plugins.
I also use the plugin for making sure relative images work, as well a |
Beta Was this translation helpful? Give feedback.
-
|
P.S. consider these two codes below. the first one is working fine, but the latter one prints the footnotes in reverse order. |
Beta Was this translation helpful? Give feedback.
-
|
Hi Thank you for MDSveX. These are all of the packages I use for markdown: |
Beta Was this translation helpful? Give feedback.
-
|
Hi, Thank you for mdsvex! In my blog, I use these remark plugins:
A custom Remark function to add word count to frontmatter: function addWordCountToFrontmatterData({
attribute = "wordCount",
} = {}) {
return function (info, file) {
let text = "";
visit(info, ["text", "code"], (node) => {
text += node.value;
});
file.data.fm[attribute] = text.split(/\s+/).length;
};
}And these rehype plugins:
For context, see my blog's repository : https://github.com/doppelganger9/blog/blob/master/mdsvex.config.js (It might not be optimal or 100% correctly configured) |
Beta Was this translation helpful? Give feedback.
-
|
The idea of "moving away from the unified ecosystem" does not seem to be a good one. Over time, this means that the community will split, and the users will find less useful resources and examples that do not work. Please refrain from doing that! Answering your question, I am using rehypeSlug, rehypeAutolinkHeadings and rehypeKatex for my math blog. https://github.com/josh-collinsworth/sveltekit-blog-starter rehypeKatex adds support for rendering equations in Latex, which is essential for my use-case. |
Beta Was this translation helpful? Give feedback.
-
As mdvsex will be moving away from the unified ecosystem in 1.0, I'd love to know what plugins people are using currently so that I can ensure nothing is missing when this change is made.
If you comment with the plugin, what you're using it for, and a link to the source, that would be great.
If you are using a custom plugin of your own making, I'd also love to hear about that too.
And if there is a plugin that you wished exist but doesn't, that would also be very useful.
Beta Was this translation helpful? Give feedback.
All reactions