Skip to content

Commit 1600931

Browse files
jp-knjjp-knj
committed
build wasm
1 parent 1506572 commit 1600931

File tree

12 files changed

+633
-1
lines changed

12 files changed

+633
-1
lines changed

‎.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,3 +10,6 @@ fuzz/corpus
1010
fuzz/artifacts
1111
fuzz/hfuzz_target
1212
fuzz/hfuzz_workspace
13+
node_modules/
14+
pnpm-lock.yaml
15+
pnpm-debug.log*

‎Cargo.toml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ rust-version = "1.56"
4141
version = "1.0.0"
4242

4343
[workspace]
44-
members = ["generate", "mdast_util_to_markdown"]
44+
members = ["generate", "mdast_util_to_markdown", "wasm"]
4545

4646
[workspace.dependencies]
4747
pretty_assertions = "1"

‎package.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"name": "markdown-rs-monorepo",
3+
"private": true,
4+
"scripts": {
5+
"build": "pnpm -r build",
6+
"test": "pnpm -r test",
7+
"lint": "cargo fmt --all && cargo clippy --all-features --all-targets --workspace"
8+
},
9+
"packageManager": "[email protected]"
10+
}

‎pnpm-workspace.yaml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
packages:
2+
- 'wasm'

‎wasm/Cargo.toml

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
[package]
2+
name = "markdown-rs-wasm"
3+
version = "0.0.1"
4+
authors = ["markdown-rs contributors"]
5+
edition = "2018"
6+
description = "WebAssembly bindings for markdown-rs"
7+
license = "MIT"
8+
repository = "https://github.com/wooorm/markdown-rs"
9+
10+
[lib]
11+
crate-type = ["cdylib"]
12+
13+
[dependencies]
14+
markdown = { path = ".." }
15+
wasm-bindgen = "0.2"
16+
serde = { version = "1.0", features = ["derive"] }
17+
serde-wasm-bindgen = "0.6"
18+
console_error_panic_hook = "0.1"
19+
20+
[dependencies.web-sys]
21+
version = "0.3"
22+
features = ["console"]
23+

‎wasm/README.md

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
# markdown-rs WASM Bindings
2+
3+
WebAssembly bindings for [markdown-rs](https://github.com/wooorm/markdown-rs).
4+
5+
## Features
6+
7+
- CommonMark compliant
8+
- GFM support (tables, strikethrough, autolinks, task lists)
9+
- MDX support (JSX in markdown)
10+
- Pure ESM module
11+
- Works in Node.js 16+
12+
- Single WASM binary (no platform-specific builds)
13+
14+
## Installation
15+
16+
```bash
17+
pnpm add markdown-rs-wasm
18+
```
19+
20+
## Usage
21+
22+
```javascript
23+
import { toHtml, toHtmlWithOptions } from 'markdown-rs-wasm';
24+
25+
// Convert markdown to HTML
26+
const html = await toHtml('# Hello World');
27+
28+
// With GitHub Flavored Markdown
29+
const gfmHtml = await toHtmlWithOptions('~strikethrough~', {
30+
gfm: true
31+
});
32+
33+
// With MDX support
34+
const mdxHtml = await toHtmlWithOptions('<Component />', {
35+
mdx: true
36+
});
37+
```
38+
39+
## API
40+
41+
### `toHtml(markdown: string): Promise<string>`
42+
43+
Converts markdown to HTML using CommonMark.
44+
45+
```javascript
46+
const html = await toHtml('# Hello World');
47+
```
48+
49+
### `toHtmlWithOptions(markdown: string, options: Object): Promise<string>`
50+
51+
Converts markdown to HTML with options.
52+
53+
**Options:**
54+
- `gfm: boolean` - Enable GitHub Flavored Markdown
55+
- `mdx: boolean` - Enable MDX (JSX in markdown)
56+
- `frontmatter: boolean` - Enable YAML frontmatter
57+
- `allowDangerousHtml: boolean` - Allow raw HTML (default: false)
58+
- `allowDangerousProtocol: boolean` - Allow dangerous protocols (default: false)
59+
60+
## Examples
61+
62+
Run the examples to see the library in action:
63+
64+
```bash
65+
# Basic example
66+
pnpm example:basic
67+
68+
# Options example (GFM, MDX, security)
69+
pnpm example:options
70+
```
71+
72+
## Testing
73+
74+
```bash
75+
# Run tests
76+
pnpm test
77+
```
78+
79+
## Building
80+
81+
```bash
82+
# Build WASM module
83+
pnpm build
84+
```
85+
86+
## Why WASM?
87+
88+
This implementation uses WebAssembly to provide:
89+
- Universal compatibility (one binary for all platforms)
90+
- No native dependencies
91+
- Reliable performance across environments
92+
93+
## License
94+
95+
MIT

‎wasm/examples/basic.mjs

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { toHtml } from '../lib/index.mjs';
2+
3+
const markdown = `# Hello World
4+
5+
This is a **markdown** document with *emphasis*.
6+
7+
## Features
8+
9+
- Fast parsing
10+
- CommonMark compliant
11+
- WebAssembly powered
12+
13+
## Code Example
14+
15+
\`\`\`javascript
16+
const result = await toHtml(markdown);
17+
console.log(result);
18+
\`\`\`
19+
20+
## Links
21+
22+
Check out [markdown-rs](https://github.com/wooorm/markdown-rs) for more information.
23+
`;
24+
25+
// Display header
26+
console.log('\n╔════════════════════════════════════════════════╗');
27+
console.log('║ markdown-rs WASM - Basic Example ║');
28+
console.log('╚════════════════════════════════════════════════╝\n');
29+
30+
// Show input
31+
console.log('Input Markdown:');
32+
console.log('```markdown');
33+
console.log(markdown.trim());
34+
console.log('```\n');
35+
36+
// Convert markdown to HTML
37+
console.log('Converting to HTML...\n');
38+
const html = await toHtml(markdown);
39+
40+
// Show output
41+
console.log('Output HTML:');
42+
console.log('```html');
43+
console.log(html.trim());
44+
console.log('```\n');
45+
46+
console.log('Conversion complete!');

‎wasm/examples/with-options.mjs

Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
import { toHtmlWithOptions } from '../lib/index.mjs';
2+
3+
console.log('\n╔════════════════════════════════════════════════╗');
4+
console.log('║ markdown-rs WASM - Options Examples ║');
5+
console.log('╚════════════════════════════════════════════════╝\n');
6+
7+
// Example 1: GitHub Flavored Markdown
8+
console.log('\n┌────────────────────────────────────────────────┐');
9+
console.log('│ Example 1: GitHub Flavored Markdown (GFM) │');
10+
console.log('└────────────────────────────────────────────────┘\n');
11+
12+
const gfmMarkdown = `
13+
## GFM Features
14+
15+
### Tables
16+
| Feature | Supported |
17+
|---------|-----------|
18+
| Tables | Yes |
19+
| Tasks | Yes |
20+
21+
### Task Lists
22+
- [x] Completed task
23+
- [ ] Pending task
24+
25+
### Strikethrough
26+
~strikethrough text~
27+
28+
### Autolinks
29+
https://github.com/wooorm/markdown-rs
30+
`;
31+
32+
const gfmHtml = await toHtmlWithOptions(gfmMarkdown, { gfm: true });
33+
console.log('Input Markdown:');
34+
console.log('```markdown');
35+
console.log(gfmMarkdown.trim());
36+
console.log('```\n');
37+
console.log('Output HTML:');
38+
console.log('```html');
39+
console.log(gfmHtml.trim());
40+
console.log('```');
41+
42+
// Example 2: MDX Support
43+
console.log('\n┌────────────────────────────────────────────────┐');
44+
console.log('│ Example 2: MDX (JSX in Markdown) │');
45+
console.log('└────────────────────────────────────────────────┘\n');
46+
47+
const mdxMarkdown = `
48+
# MDX Example
49+
50+
<CustomComponent prop="value" />
51+
52+
Regular markdown with **JSX** components.
53+
`;
54+
55+
const mdxHtml = await toHtmlWithOptions(mdxMarkdown, { mdx: true });
56+
console.log('Input Markdown:');
57+
console.log('```mdx');
58+
console.log(mdxMarkdown.trim());
59+
console.log('```\n');
60+
console.log('Output HTML:');
61+
console.log('```html');
62+
console.log(mdxHtml.trim());
63+
console.log('```');
64+
65+
// Example 3: Frontmatter
66+
console.log('\n┌────────────────────────────────────────────────┐');
67+
console.log('│ Example 3: Frontmatter Support │');
68+
console.log('└────────────────────────────────────────────────┘\n');
69+
70+
const frontmatterMarkdown = `---
71+
title: Example Post
72+
date: 2024-01-01
73+
---
74+
75+
# Content
76+
77+
This is the actual content after frontmatter.
78+
`;
79+
80+
const frontmatterHtml = await toHtmlWithOptions(frontmatterMarkdown, {
81+
frontmatter: true
82+
});
83+
console.log('Input Markdown:');
84+
console.log('```markdown');
85+
console.log(frontmatterMarkdown.trim());
86+
console.log('```\n');
87+
console.log('Output HTML:');
88+
console.log('```html');
89+
console.log(frontmatterHtml.trim());
90+
console.log('```');
91+
92+
// Example 4: Security Options
93+
console.log('\n┌────────────────────────────────────────────────┐');
94+
console.log('│ Example 4: Security Options │');
95+
console.log('└────────────────────────────────────────────────┘\n');
96+
97+
const dangerousMarkdown = `
98+
<script>console.log('This is JavaScript');</script>
99+
100+
[Dangerous Link](javascript:alert('XSS'))
101+
`;
102+
103+
console.log('Input Markdown:');
104+
console.log('```markdown');
105+
console.log(dangerousMarkdown.trim());
106+
console.log('```\n');
107+
108+
console.log('Safe mode output (default):');
109+
console.log('```html');
110+
const safeHtml = await toHtmlWithOptions(dangerousMarkdown, {});
111+
console.log(safeHtml.trim());
112+
console.log('```\n');
113+
114+
console.log('Dangerous mode output (be careful!):');
115+
console.log('```html');
116+
const dangerousHtml = await toHtmlWithOptions(dangerousMarkdown, {
117+
allowDangerousHtml: true,
118+
allowDangerousProtocol: true
119+
});
120+
console.log(dangerousHtml.trim());
121+
console.log('```');
122+
123+
// Example 5: Combined Options
124+
console.log('\n┌────────────────────────────────────────────────┐');
125+
console.log('│ Example 5: Combined Options (GFM + MDX) │');
126+
console.log('└────────────────────────────────────────────────┘\n');
127+
128+
const combinedMarkdown = `
129+
| GFM | MDX |
130+
|-----|-----|
131+
| Yes | Yes |
132+
133+
~strikethrough~ and <Component />
134+
`;
135+
136+
const combinedHtml = await toHtmlWithOptions(combinedMarkdown, {
137+
gfm: true,
138+
mdx: true
139+
});
140+
console.log('Input Markdown:');
141+
console.log('```markdown');
142+
console.log(combinedMarkdown.trim());
143+
console.log('```\n');
144+
console.log('Output HTML:');
145+
console.log('```html');
146+
console.log(combinedHtml.trim());
147+
console.log('```');
148+
149+
console.log('\n╔════════════════════════════════════════════════╗');
150+
console.log('║ Examples Completed! ║');
151+
console.log('╚════════════════════════════════════════════════╝\n');

0 commit comments

Comments
 (0)