### Installing mdast-util-from-markdown with npm (Shell)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Provides the command-line instruction to install the `mdast-util-from-markdown` package using npm. This package is designed for Node.js environments (version 16+) and is ESM only.
```sh
npm install mdast-util-from-markdown
```
--------------------------------
### Example Markdown Input for Parsing
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Presents a sample Markdown string that serves as input for the `mdast-util-from-markdown` utility. This snippet illustrates a basic heading with emphasized text, which will be converted into an mdast syntax tree.
```markdown
## Hello, *World*!
```
--------------------------------
### JavaScript Fenced Code Block
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This example demonstrates a fenced code block explicitly marked as JavaScript. This allows for proper syntax highlighting and language-specific processing.
```js
fenced code with a language
```
--------------------------------
### Inline Code: Leading Newline with Character
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet starting with a newline character followed by text, illustrating the preservation of leading newline characters within the code block.
```Text
\nh
```
--------------------------------
### Multi-line Code: Newline and Tab Indentation
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
A multi-line code snippet demonstrating text spanning multiple lines, including a line indented with a tab character. This example highlights the accurate capture of both newlines and tab characters.
```Text
alpha bravo charlie\n\tdelta echo
```
--------------------------------
### Inline Code: Single Character
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
A basic inline code snippet containing a single character, demonstrating the simplest form of code representation without special whitespace.
```Text
a
```
--------------------------------
### Tilde-Fenced Code Block with Content
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This example shows a fenced code block defined by tildes, containing a single line of content 'asd'. This highlights the basic structure of a tilde-fenced block with content.
```plaintext
asd
```
--------------------------------
### Inline Code: Leading and Trailing Spaces
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet containing a single character surrounded by spaces, highlighting the preservation of both leading and trailing whitespace.
```Text
d
```
--------------------------------
### Inline Code: Leading Space
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet showing a single character preceded by a space, illustrating the preservation of leading whitespace within the code block.
```Text
b
```
--------------------------------
### Inline Code: Trailing Space
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet showing a single character followed by a space, demonstrating the preservation of trailing whitespace within the code block.
```Text
c
```
--------------------------------
### Resulting mdast Syntax Tree Structure (JavaScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Displays the expected output structure of an mdast syntax tree generated by parsing the example Markdown. This JavaScript object literal shows how headings, text, and emphasis nodes are represented in the tree, including their types, values, and children.
```js
{
type: 'root',
children: [
{
type: 'heading',
depth: 2,
children: [
{type: 'text', value: 'Hello, '},
{type: 'emphasis', children: [{type: 'text', value: 'World'}]},
{type: 'text', value: '!'}
]
}
]
}
```
--------------------------------
### Inline Code: Character with Trailing Newline
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet featuring a character immediately followed by a newline, demonstrating how newline characters are captured and represented within the code string.
```Text
f\n
```
--------------------------------
### JavaScript Fenced Code Block with Meta
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This snippet showcases a JavaScript fenced code block that includes additional metadata, such as 'line=1'. Such metadata can be used by parsers or renderers for specific display or processing instructions.
```js
fenced code with meta
```
--------------------------------
### Backtick-Fenced Code Block with Trailing Newline
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This example shows a fenced code block defined by backticks, containing content 'asd' followed by a newline. This demonstrates how trailing newlines within the code block are preserved.
```plaintext
asd\n
```
--------------------------------
### Inline Code: Character with Trailing Newline
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet featuring a character immediately followed by a newline, demonstrating how newline characters are captured and represented within the code string.
```Text
e\n
```
--------------------------------
### Inline Code: Character with Trailing Newline
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-text.md
An inline code snippet featuring a character immediately followed by a newline, demonstrating how newline characters are captured and represented within the code string.
```Text
g\n
```
--------------------------------
### Basic Plaintext Fenced Code Block
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This snippet illustrates a fundamental fenced code block using backticks, without any specified language. The content is treated as plain text.
```plaintext
fenced code
```
--------------------------------
### Plaintext Fenced Code Block with Tildes
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This snippet demonstrates a fenced code block using tilde characters (~~~) as fences instead of backticks. It functions identically to backtick-fenced blocks for plain text content.
```plaintext
fenced code with tildes
```
--------------------------------
### Basic Indented Code Block (Spaces)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-indented.md
This snippet demonstrates a basic code block indented using four spaces. It shows two consecutive lines forming a single block, typical for markdown's indented code syntax.
```Plain Text
indented code
more indented code
```
--------------------------------
### Mixed Indentation Code Block (Tabs and Spaces)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-indented.md
This snippet showcases a code block using a mix of tab and space characters for indentation. It demonstrates how different combinations of leading whitespace are interpreted as part of an indented code block.
```Plain Text
tabs
and mixed with spaces
extra spaces
```
--------------------------------
### Backtick-Fenced Code Block with Content
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-fenced.md
This snippet illustrates a fenced code block defined by backticks, containing a single line of content 'asd'. It demonstrates the standard way to enclose code or text within a backtick fence.
```plaintext
asd
```
--------------------------------
### Plain Text in Indented Code Block with Entities
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/character-references-everywhere.md
This example demonstrates an indented code block containing an HTML entity (`Ö`). `mdast-util-from-markdown` treats the content of indented code blocks as literal text, meaning the entity is not interpreted and remains as part of the raw string.
```Plain Text
CÖDE block.
```
--------------------------------
### Single Line Tab-Indented Code Block
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-indented.md
This snippet demonstrates a simple code block consisting of a single line, indented solely by a tab character. It confirms that a single tab is sufficient to identify a line as part of an indented code block.
```Plain Text
a tab
```
--------------------------------
### Deeply Indented Code Block (Spaces)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/code-indented.md
This snippet illustrates a code block with deeper and potentially inconsistent space-based indentation. It highlights how multiple lines, even with varying levels of indentation, can be grouped into a single code block if they maintain an initial indentation.
```Plain Text
more
indent
```
--------------------------------
### Importing fromMarkdown in Deno (JavaScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Demonstrates how to import the `fromMarkdown` function in a Deno environment. It uses `esm.sh` to fetch the module, enabling direct use in Deno projects.
```js
import {fromMarkdown} from 'https://esm.sh/mdast-util-from-markdown@2'
```
--------------------------------
### Importing fromMarkdown in Browsers (HTML)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Shows how to import the `fromMarkdown` function directly within a browser using an HTML `
```
--------------------------------
### Parsing Markdown File to mdast Tree (JavaScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
Illustrates the core usage of `mdast-util-from-markdown` in a Node.js environment. This JavaScript code reads a Markdown file, parses its content into an mdast syntax tree, and logs the resulting tree structure.
```js
import fs from 'node:fs/promises'
import {fromMarkdown} from 'mdast-util-from-markdown'
const doc = await fs.readFile('example.md')
const tree = fromMarkdown(doc)
console.log(tree)
```
--------------------------------
### Extracting PHP from Processing Instruction
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/html-flow.md
This snippet shows how to extract code from PHP-style processing instructions (). The content 'c' represents the PHP code that would be processed by a PHP interpreter.
```PHP
c
```
--------------------------------
### Defining CompileData Interface (TypeScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
This snippet shows the basic definition of the `CompileData` interface, which represents a key-value store for information passed around during the compilation process in `mdast-util-from-markdown`. It serves as a placeholder, indicating that its full structure is defined elsewhere or is extensible.
```TypeScript
interface CompileData { /* see code */ }
```
--------------------------------
### Extending CompileData Interface for Custom Fields (TypeScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
This snippet demonstrates how to extend the `CompileData` interface within the `mdast-util-from-markdown` module. It allows developers to register new custom fields, such as `mathFlowInside`, enabling extensions to store and access additional data relevant to their specific parsing or transformation logic.
```TypeScript
declare module 'mdast-util-from-markdown' {
interface CompileData {
// Register a new field.
mathFlowInside?: boolean | undefined
}
}
```
--------------------------------
### Defining Micromark Token Type (TypeScript)
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/readme.md
This snippet defines the `Token` type, representing a token generated by the `micromark` parser. It serves as a placeholder, indicating that the full structure of a token, including its properties and methods, is defined elsewhere or is more complex than shown.
```TypeScript
type Token = { /* … */ }
```
--------------------------------
### Extracting JavaScript from Script Tag
Source: https://github.com/syntax-tree/mdast-util-from-markdown/blob/main/test/fixtures/html-flow.md
This snippet demonstrates extracting JavaScript code embedded within standard HTML