feat: use vite logger

Author: CHOYSEN

Diff for: src/node/build/build.ts

@@ -106,7 +106,9 @@ export async function build(
 
   await siteConfig.buildEnd?.(siteConfig)
 
-  console.log(`build complete in ${((Date.now() - start) / 1000).toFixed(2)}s.`)
+  siteConfig.logger.info(
+    `build complete in ${((Date.now() - start) / 1000).toFixed(2)}s.`
+  )
 }
 
 function linkVue() {

Diff for: src/node/cli.ts

@@ -1,11 +1,12 @@
 import c from 'picocolors'
 import minimist from 'minimist'
+import { createLogger } from 'vite'
 import { createServer, build, serve } from '.'
 import { version } from '../../package.json'
 
 const argv: any = minimist(process.argv.slice(2))
 
-console.log(c.cyan(`vitepress v${version}`))
+const tempLogger = createLogger()
 
 const command = argv._[0]
 const root = argv._[command ? 1 : 0]
@@ -17,27 +18,41 @@ if (!command || command === 'dev') {
   const createDevServer = async () => {
     const server = await createServer(root, argv, async () => {
       await server.close()
-      await createDevServer()
+      const newServer = await createDevServer()
+      await newServer.listen()
+      newServer.printUrls()
     })
-    await server.listen()
-    console.log()
-    server.printUrls()
+    return server
   }
-  createDevServer().catch((err) => {
-    console.error(c.red(`failed to start server. error:\n`), err)
-    process.exit(1)
-  })
-} else if (command === 'build') {
-  build(root, argv).catch((err) => {
-    console.error(c.red(`build error:\n`), err)
-    process.exit(1)
+  createDevServer()
+    .then(async (server) => {
+      await server.listen()
+      server.config.logger.info(
+        `\n  ${c.green(`${c.bold('VITEPRESS')} v${version}`)}\n`,
+        { clear: !server.config.logger.hasWarned }
+      )
+      server.printUrls()
+    })
+    .catch((err) => {
+      tempLogger.error(c.red(`failed to start server. error:\n${err}`))
+      process.exit(1)
+    })
+} else {
+  tempLogger.info(`\n  ${c.green(`${c.bold('VITEPRESS')} v${version}`)}\n`, {
+    clear: true
   })
-} else if (command === 'serve' || command === 'preview') {
-  serve(argv).catch((err) => {
-    console.error(c.red(`failed to start server. error:\n`), err)
+  if (command === 'build') {
+    build(root, argv).catch((err) => {
+      tempLogger.error(c.red(`build error:\n`), err)
+      process.exit(1)
+    })
+  } else if (command === 'serve' || command === 'preview') {
+    serve(argv).catch((err) => {
+      tempLogger.error(c.red(`failed to start server. error:\n${err}`))
+      process.exit(1)
+    })
+  } else {
+    tempLogger.info(c.red(`unknown command "${command}".`))
     process.exit(1)
-  })
-} else {
-  console.log(c.red(`unknown command "${command}".`))
-  process.exit(1)
+  }
 }

Diff for: src/node/config.ts

@@ -6,10 +6,12 @@ import path from 'path'
 import { match, compile } from 'path-to-regexp'
 import c from 'picocolors'
 import {
+  createLogger,
   loadConfigFromFile,
   mergeConfig as mergeViteConfig,
   normalizePath,
-  type UserConfig as ViteConfig
+  type UserConfig as ViteConfig,
+  type Logger
 } from 'vite'
 import { DEFAULT_THEME_PATH } from './alias'
 import type { MarkdownOptions } from './markdown/markdown'
@@ -180,6 +182,7 @@ export interface SiteConfig<ThemeConfig = any>
     map: Record<string, string | undefined>
     inv: Record<string, string | undefined>
   }
+  logger: Logger
 }
 
 const resolve = (root: string, file: string) =>
@@ -206,6 +209,7 @@ export async function resolveConfig(
   command: 'serve' | 'build' = 'serve',
   mode = 'development'
 ): Promise<SiteConfig> {
+  const logger = createLogger('info', { prefix: '[vitepress]' })
   const [userConfig, configPath, configDeps] = await resolveUserConfig(
     root,
     command,
@@ -264,6 +268,7 @@ export async function resolveConfig(
     configDeps,
     outDir,
     cacheDir,
+    logger,
     tempDir: resolve(root, '.temp'),
     markdown: userConfig.markdown,
     lastUpdated: userConfig.lastUpdated,

Diff for: src/node/markdown/markdown.ts

@@ -15,6 +15,7 @@ import { sfcPlugin, type SfcPluginOptions } from '@mdit-vue/plugin-sfc'
 import { titlePlugin } from '@mdit-vue/plugin-title'
 import { tocPlugin, type TocPluginOptions } from '@mdit-vue/plugin-toc'
 import { slugify } from '@mdit-vue/shared'
+import type { Logger } from 'vite'
 import type { IThemeRegistration } from 'shiki'
 import { highlight } from './plugins/highlight'
 import { highlightLinePlugin } from './plugins/highlightLines'
@@ -55,14 +56,15 @@ export type MarkdownRenderer = MarkdownIt
 export const createMarkdownRenderer = async (
   srcDir: string,
   options: MarkdownOptions = {},
-  base = '/'
+  base = '/',
+  logger: Logger
 ): Promise<MarkdownRenderer> => {
   const md = MarkdownIt({
     html: true,
     linkify: true,
     highlight:
       options.highlight ||
-      (await highlight(options.theme, options.defaultHighlightLang)),
+      (await highlight(options.theme, options.defaultHighlightLang, logger)),
     ...options
   }) as MarkdownRenderer
 

Diff for: src/node/markdown/plugins/highlight.ts

@@ -12,6 +12,7 @@ import {
   type Processor
 } from 'shiki-processor'
 import type { ThemeOptions } from '../markdown'
+import type { Logger } from 'vite'
 
 const nanoid = customAlphabet('abcdefghijklmnopqrstuvwxyz', 10)
 
@@ -57,7 +58,8 @@ const errorLevelProcessor = defineProcessor({
 
 export async function highlight(
   theme: ThemeOptions = 'material-theme-palenight',
-  defaultLang: string = ''
+  defaultLang: string = '',
+  logger: Logger
 ): Promise<(str: string, lang: string, attrs: string) => string> {
   const hasSingleTheme = typeof theme === 'string' || 'name' in theme
   const getThemeName = (themeValue: IThemeRegistration) =>
@@ -89,7 +91,7 @@ export async function highlight(
     if (lang) {
       const langLoaded = highlighter.getLoadedLanguages().includes(lang as any)
       if (!langLoaded && lang !== 'ansi') {
-        console.warn(
+        logger.warn(
           c.yellow(
             `The language '${lang}' is not loaded, falling back to '${
               defaultLang || 'txt'

Diff for: src/node/markdownToVue.ts

@@ -39,9 +39,14 @@ export async function createMarkdownToVueRenderFn(
   base = '/',
   includeLastUpdatedData = false,
   cleanUrls = false,
-  siteConfig: SiteConfig | null = null
+  siteConfig: SiteConfig
 ) {
-  const md = await createMarkdownRenderer(srcDir, options, base)
+  const md = await createMarkdownRenderer(
+    srcDir,
+    options,
+    base,
+    siteConfig.logger
+  )
   pages = pages.map((p) => slash(p.replace(/\.md$/, '')))
   const replaceRegex = genReplaceRegexp(userDefines, isBuild)
 
@@ -95,7 +100,7 @@ export async function createMarkdownToVueRenderFn(
     // validate data.links
     const deadLinks: string[] = []
     const recordDeadLink = (url: string) => {
-      console.warn(
+      siteConfig.logger.warn(
         c.yellow(
           `\n(!) Found dead link ${c.cyan(url)} in file ${c.white(
             c.dim(file)

Diff for: src/node/plugin.ts

@@ -290,19 +290,22 @@ export async function createVitePressPlugin(
     async handleHotUpdate(ctx) {
       const { file, read, server } = ctx
       if (file === configPath || configDeps.includes(file)) {
-        console.log(
+        siteConfig.logger.info(
           c.green(
-            `\n${path.relative(
+            `${path.relative(
               process.cwd(),
               file
             )} changed, restarting server...`
-          )
+          ),
+          { clear: true, timestamp: true }
         )
         try {
           clearCache()
           await recreateServer?.()
         } catch (err) {
-          console.error(c.red(`failed to restart server. error:\n`), err)
+          siteConfig.logger.error(
+            c.red(`failed to restart server. error:\n${err}`)
+          )
         }
         return
       }

Diff for: src/node/serve/serve.ts

@@ -54,13 +54,15 @@ export async function serve(options: ServeOptions = {}) {
     return polka({ onNoMatch })
       .use(base, compress, serve)
       .listen(port, () => {
-        console.log(`Built site served at http://localhost:${port}/${base}/\n`)
+        site.logger.info(
+          `Built site served at http://localhost:${port}/${base}/\n`
+        )
       })
   } else {
     return polka({ onNoMatch })
       .use(compress, serve)
       .listen(port, () => {
-        console.log(`Built site served at http://localhost:${port}/\n`)
+        site.logger.info(`Built site served at http://localhost:${port}/\n`)
       })
   }
 }

Diff for: src/node/server.ts

@@ -23,6 +23,7 @@ export async function createServer(
     cacheDir: config.cacheDir,
     // logLevel: 'warn',
     plugins: await createVitePressPlugin(config, false, {}, {}, recreateServer),
-    server: serverOptions
+    server: serverOptions,
+    customLogger: config.logger
   })
 }