Skip to content

console

  1. console.log
javascript
// 使用 JavaScript 代码块标记
console.log('Hello, world!')
  1. console.info
javascript
// 使用 JavaScript 代码块标记
console.info('This is an informational message.')
  1. console.error
javascript
// 使用 JavaScript 代码块标记
console.error('An error has occurred.')
  1. console.warn
javascript
// 使用 JavaScript 代码块标记
console.warn('Warning: This is a warning message.')
  1. console.time & console.timeEnd
javascript
// 使用 JavaScript 代码块标记
console.time('timer')
// Code to measure execution time
console.timeEnd('timer')
  1. console.count
javascript
// 使用 JavaScript 代码块标记
const fruits = ['apple', 'banana', 'orange', 'banana']
fruits.forEach((fruit) => {
  console.count(fruit)
})
  1. console.table
javascript
// 使用 JavaScript 代码块标记
const data = [
  { name: 'Alice', age: 26 },
  { name: 'Bob', age: 27 },
  { name: 'Carl', age: 30 },
]
console.table(data)
  1. console.group, console.groupCollapsed, console.groupEnd
javascript
// 使用 JavaScript 代码块标记
console.group('Group 1')
console.log('Hello, world!')
console.groupEnd()

console.groupCollapsed('Group 2')
console.info('This is some info.')
console.warn('This is a warning.')
console.groupEnd()
  1. console.trace
javascript
// 使用 JavaScript 代码块标记
function foo() {
  console.trace()
}

function bar() {
  foo()
}

bar()
  1. console.assert
javascript
// 使用 JavaScript 代码块标记
const num1 = 5
const num2 = 10
console.assert(num1 === num2, 'The two numbers are not equal!')
  1. console.clear
javascript
// 使用 JavaScript 代码块标记
console.log('This message will not be visible after calling console.clear().')
console.clear()
  1. console 设置 style
javascript
// 使用 JavaScript 代码块标记
console.log(
  '%c My custom message',
  'background-color: #f00; color: #fff; font-size: 20px;'
)

Layout Switch

Adjust the layout style of VitePress to adapt to different reading needs and screens.

Expand all
The sidebar and content area occupy the entire width of the screen.
Expand sidebar with adjustable values
Expand sidebar width and add a new slider for user to choose and customize their desired width of the maximum width of sidebar can go, but the content area width will remain the same.
Expand all with adjustable values
Expand sidebar width and add a new slider for user to choose and customize their desired width of the maximum width of sidebar can go, but the content area width will remain the same.
Original width
The original layout width of VitePress

Page Layout Max Width

Adjust the exact value of the page width of VitePress layout to adapt to different reading needs and screens.

Adjust the maximum width of the page layout
A ranged slider for user to choose and customize their desired width of the maximum width of the page layout can go.

Content Layout Max Width

Adjust the exact value of the document content width of VitePress layout to adapt to different reading needs and screens.

Adjust the maximum width of the content layout
A ranged slider for user to choose and customize their desired width of the maximum width of the content layout can go.

Spotlight

Highlight the line where the mouse is currently hovering in the content to optimize for users who may have reading and focusing difficulties.

ONOn
Turn on Spotlight.
OFFOff
Turn off Spotlight.