noahlange / markwright-vscode

Dead-simple desktop publishing in VSCode with Markdown and SASS.

Markwright

A VSCode plugin for quick-and-dirty typesetting using Markdown, CSS and PagedJS.

Installation

• git clone https://github.com/noahlange/markwright-vscode.git
• cd markwright-vscode
• npm i && npm run dev:bundle
• Command Palette
  • "Extensions: Install from VSIX..."
  • "Markwright: Open the working directory as a Markwright document."

Roadmap

• scroll + zoom + pan
• minimap navigation
• baseline grid overlay
• column-* issues
• Export
  • PDF
  • HTML
  • IDML (?)
• incremental page rendering
• incremental dom rewrite
• actual vscode package distribution
• facing pages vs. single-page

Implementation details

Content & Styles

• all markdown (.md, .markdown) files in the workspace are concatenated in alphabetical order.
• all CSS (.css) files in the workspace are concatenated in alphabetical order.

Images

Image paths are resolved relative to the Markdown or CSS file referencing the image.

<!-- Given /Users/foo/source.md -->

<!-- the relative path -->
<img alt="My Image" src="./image.svg" />

<!--- resolves to... -->
<img alt="My Image" src="/Users/foo/image.svg" />

// /Users/foo/styles.css

div {
  // relative path...
  background: url('./image.svg');
  // resolves to...
  background: url('/Users/foo/image.svg');
}