3 ms·
Ask HN: Knowledge-base site using VSCodium/FOAM/MkDocs
Hello HN -
I'm using VSCodium (open-source VSCode), with the FOAM plugin (similar to Obsidian / ROAM) to create a cross-linked notes/knowledge base. If you haven't tried it out - it's easy to setup, and works great.
It's like Obsidian... but open-source.
The next step I'm doing is to publish those notes as an HTML site. MkDocs-Material is perfect for this. The difficulty with using MkDocs & Markdown files with [[MyTopic]] links, is that MkDocs doesn't know how to automatically link to other pages. Fortunately, there is a MkDocs plugin called RoamLinks, which automatically converts the [[MyTopic]] links into HTML links to other pages - no matter where they are on the filesystem (very cool!!). That "unblocked" me - one struggle I was having when writing, was that I was renaming files & re-organizing - but that resulted in tons of Markdown links being broken - a huge chore that made writing un-fun. Now I can just "bracket bracket" any term that I want to reference/write later, and its good to go. Basically - its working great.
(Approximating the experience of Obsidian Publish)
The problem I'm having now is, when I do NOT have a page written [[MyNewTopic]], MkDocs/ROAMLinks can't link to the (unwritten) page. Instead, it outputs the text quite literally, as "[[MyNewTopic]]", with the brackets. Quite ugly. I'd love to have MkDocs/ROAMLinks NOT generate links for those pages AND hide/suppress the "[[ ]]". - I did a quick search on this (including ChatGPT) and the suggestions were. (1) Write a custom markdown renderer, before being processed by MkDocs, (2) create a custom MkDocs plugin, and (3) HTML post-processing (scraping out the [[ ]]).
One of the benefits of the VSCodium/FOAM/MkDocs/RoamLinks stack is that it basically "just works" - I write, run MkDocs build, get a website, and can `aws s3 sync` it to a AWS bucket, and the site is live. The only "glitch" right now is these dannnng brackets
Can anyone suggest a better way to suppress the [[ ]] for links which don't exist yet?
I'd also love to hear others' thoughts on the "open-source, cross-linked notes, published as a searchable website" stack.
Thanks!
// Links to the tools
- https://vscodium.com/
- https://foambubble.github.io/foam/
- https://squidfunk.github.io/mkdocs-material/
- https://github.com/Jackiexiao/mkdocs-roamlinks-plugin
- dv35z 3y agoOption #3 (HTML post-procssing) seemed to work. This Python script takes a directory of HTML files, and removes the [[ and ]] and replaces them with <span class="link-placeholder"> and </span>. ---- import os from bs4 import BeautifulSoup # Function to process HTML files in a directory def process_html_files(directory): for root, dirs, files in os.walk(directory): for file in files: if file.endswith('.html'): filepath = os.path.join(root, file) process_html_file(filepath) # Function to process individual HTML file def process_html_file(filepath): with open(filepath, 'r') as f: html_content = f.read() # Parse HTML soup = BeautifulSoup(html_content, 'html.parser') # Iterate through all text nodes in the HTML for text_node in soup.find_all(text=True): if '[[' in text_node and ']]' in text_node: # Replace [[ and ]] within the text nodes with <span> tags replaced_text = text_node.replace('[[', '<span class="link-placeholder">').replace(']]', '</span>') text_node.replace_with(BeautifulSoup(replaced_text, 'html.parser')) # Write back the modified HTML with open(filepath, 'w') as f: f.write(str(soup)) # Replace 'your_directory_path' with the directory containing your HTML files process_html_files('site')