Expressive Code Example

1
console.log("This code is syntax highlighted!");

1
// This code block will show line numbers
2
console.log("Greetings from line 2!");
3
console.log("I am on line 3");

5
console.log("Greetings from line 5!");
6
console.log("I am on line 6");

1
// Line 1 - targeted by line number
2
// Line 2
3
// Line 3
4
// Line 4 - targeted by line number
5
// Line 5
6
// Line 6
7
// Line 7 - targeted by range "7-8"
8
// Line 8 - targeted by range "7-8"

1
this line will be marked as inserted
2
this line will be marked as deleted
3
this is a regular line

1
function thisIsJavaScript() {
2
  // This entire block gets highlighted as JavaScript,
3
  // and we can still add diff markers to it!
4
  console.log('Old code to be removed')
5
  console.log('New and shiny code!')
6
}

1
function getLongString() {
2
  return "This is a very long string that will most probably not fit into the available space unless the container is extremely wide";
3
}

残り 5 行
1
// All this boilerplate setup code will be collapsed
2
import { someBoilerplateEngine } from "@example/some-boilerplate";
3
import { evenMoreBoilerplate } from "@example/even-more-boilerplate";
4

5
const engine = someBoilerplateEngine(evenMoreBoilerplate());
6

7
// This part of the code will be visible by default
8
engine.doSomething(1, 2, 3, calcFn);
9

10
function calcFn() {
11
  // You can have multiple collapsed sections
残り 3 行
12
  const a = 1;
13
  const b = 2;
14
  const c = a + b;
15

16
  // This will remain visible
17
  console.log(`Calculation result: ${a} + ${b} = ${c}`);
18
  return c;
19
}
20

残り 4 行
21
// All this code until the end of the block will be collapsed again
22
engine.closeConnection();
23
engine.freeMemory();
24
engine.shutdown({ reason: "End of example boilerplate code" });