feat(cli): allow setting default app config

Author: meteorlxy

packages/@vuepress/cli/src/cli.ts

@@ -1,6 +1,7 @@
 import { cac } from 'cac'
+import type { AppConfig } from '@vuepress/core'
 import { chalk } from '@vuepress/utils'
-import { build, dev, info } from './commands'
+import { createBuild, createDev, info } from './commands'
 import { allowTs } from './utils'
 
 /**
@@ -18,7 +19,7 @@ const wrapCommand = (cmd: (...args: any[]) => Promise<void>): typeof cmd => {
 /**
  * Vuepress cli
  */
-export const cli = (): void => {
+export const cli = (defaultAppConfig: Partial<AppConfig> = {}): void => {
   // allow ts files globally
   allowTs()
 
@@ -46,7 +47,7 @@ export const cli = (): void => {
     .option('--open', 'Open browser when ready')
     .option('--debug', 'Enable debug mode')
     .option('--no-watch', 'Disable watching page and config files')
-    .action(wrapCommand(dev))
+    .action(wrapCommand(createDev(defaultAppConfig)))
 
   // register `build` command
   program
@@ -61,7 +62,7 @@ export const cli = (): void => {
     .option('--clean-temp', 'Clean the temporary files before build')
     .option('--clean-cache', 'Clean the cache files before build')
     .option('--debug', 'Enable debug mode')
-    .action(wrapCommand(build))
+    .action(wrapCommand(createBuild(defaultAppConfig)))
 
   // register `info` command
   program

packages/@vuepress/cli/src/commands/build/build.ts renamed to packages/@vuepress/cli/src/commands/build/createBuild.ts

@@ -1,4 +1,5 @@
 import { createApp } from '@vuepress/core'
+import type { AppConfig } from '@vuepress/core'
 import { debug, fs, logger } from '@vuepress/utils'
 import {
   loadUserConfig,
@@ -11,9 +12,16 @@ import type { BuildCommandOptions } from './types'
 
 const log = debug('vuepress:cli/build')
 
-export const build = async (
+export type BuildCommand = (
+  sourceDir?: string,
+  commandOptions?: BuildCommandOptions
+) => Promise<void>
+
+export const createBuild = (
+  defaultAppConfig: Partial<AppConfig>
+): BuildCommand => async (
   sourceDir = '.',
-  commandOptions: BuildCommandOptions = {}
+  commandOptions = {}
 ): Promise<void> => {
   log(`commandOptions:`, commandOptions)
 
@@ -22,22 +30,25 @@ export const build = async (
   }
 
   // resolve base app config
-  const appConfig = resolveBuildAppConfig(sourceDir, commandOptions)
+  const cliAppConfig = resolveBuildAppConfig(sourceDir, commandOptions)
 
   // resolve user config file
   const userConfigPath = commandOptions.config
     ? resolveUserConfigPath(commandOptions.config)
-    : resolveUserConfigConventionalPath(appConfig.source)
+    : resolveUserConfigConventionalPath(cliAppConfig.source)
 
   log(`userConfigPath:`, userConfigPath)
 
   const userConfig = await loadUserConfig(userConfigPath)
 
   // create vuepress app
   const app = createApp({
+    // allow setting default app config via `cli()`
+    // for example, set different default bundler in `vuepress` and `vuepress-vite` package
+    ...defaultAppConfig,
     // use cli options to override config file
     ...userConfig,
-    ...appConfig,
+    ...cliAppConfig,
   })
 
   // use user-config plugin

packages/@vuepress/cli/src/commands/build/index.ts

@@ -1,3 +1,3 @@
-export * from './build'
+export * from './createBuild'
 export * from './resolveBuildAppConfig'
 export * from './types'

packages/@vuepress/cli/src/commands/dev/createDev.ts

@@ -0,0 +1,141 @@
+import * as chokidar from 'chokidar'
+import type { FSWatcher } from 'chokidar'
+import { createApp } from '@vuepress/core'
+import type { AppConfig } from '@vuepress/core'
+import { chalk, debug, fs, logger } from '@vuepress/utils'
+import {
+  loadUserConfig,
+  resolveUserConfigConventionalPath,
+  resolveUserConfigPath,
+  transformUserConfigToPlugin,
+} from '../../config'
+import { handlePageAdd } from './handlePageAdd'
+import { handlePageChange } from './handlePageChange'
+import { handlePageUnlink } from './handlePageUnlink'
+import { resolveDevAppConfig } from './resolveDevAppConfig'
+import type { DevCommandOptions } from './types'
+
+const log = debug('vuepress:cli/dev')
+
+export type DevCommand = (
+  sourceDir?: string,
+  commandOptions?: DevCommandOptions
+) => Promise<void>
+
+export const createDev = (defaultAppConfig: Partial<AppConfig>): DevCommand => {
+  const dev: DevCommand = async (
+    sourceDir = '.',
+    commandOptions = {}
+  ): Promise<void> => {
+    log(`commandOptions:`, commandOptions)
+
+    if (process.env.NODE_ENV === undefined) {
+      process.env.NODE_ENV = 'development'
+    }
+
+    // resolve app config from cli options
+    const cliAppConfig = resolveDevAppConfig(sourceDir, commandOptions)
+
+    // resolve user config file
+    const userConfigPath = commandOptions.config
+      ? resolveUserConfigPath(commandOptions.config)
+      : resolveUserConfigConventionalPath(cliAppConfig.source)
+
+    log(`userConfigPath:`, userConfigPath)
+
+    const userConfig = await loadUserConfig(userConfigPath)
+
+    // create vuepress app
+    const app = createApp({
+      // allow setting default app config via `cli()`
+      // for example, set different default bundler in `vuepress` and `vuepress-vite` package
+      ...defaultAppConfig,
+      // use cli options to override config file
+      ...userConfig,
+      ...cliAppConfig,
+    })
+
+    // use user-config plugin
+    app.use(transformUserConfigToPlugin(app, userConfig))
+
+    // clean temp and cache
+    if (commandOptions.cleanTemp === true) {
+      logger.info('Cleaning temp...')
+      await fs.remove(app.dir.temp())
+    }
+    if (commandOptions.cleanCache === true) {
+      logger.info('Cleaning cache...')
+      await fs.remove(app.dir.cache())
+    }
+
+    // initialize and prepare
+    logger.info('Initializing VuePress and preparing data...')
+    await app.init()
+    await app.prepare()
+
+    // start dev server
+    const close = await app.dev()
+
+    // do not watch files if `watch` is set to `false`
+    if (commandOptions.watch === false) {
+      return
+    }
+
+    // all watchers
+    const watchers: FSWatcher[] = []
+
+    // restart dev command
+    const restart = async (): Promise<void> => {
+      await Promise.all([
+        // close all watchers
+        ...watchers.map((item) => item.close()),
+        // close current dev server
+        close(),
+      ])
+      // restart dev command
+      await dev(sourceDir, {
+        ...commandOptions,
+        // do not clean cache and temp on restart
+        cleanCache: false,
+        cleanTemp: false,
+      })
+      logger.tip(`dev server has restarted, please refresh your browser`)
+    }
+
+    // watch page files
+    const pagesWatcher = chokidar.watch(app.options.pagePatterns, {
+      cwd: app.dir.source(),
+      ignoreInitial: true,
+    })
+    pagesWatcher.on('add', (filePathRelative) => {
+      logger.info(`page ${chalk.magenta(filePathRelative)} is created`)
+      handlePageAdd(app, app.dir.source(filePathRelative))
+    })
+    pagesWatcher.on('change', (filePathRelative) => {
+      logger.info(`page ${chalk.magenta(filePathRelative)} is modified`)
+      handlePageChange(app, app.dir.source(filePathRelative))
+    })
+    pagesWatcher.on('unlink', (filePathRelative) => {
+      logger.info(`page ${chalk.magenta(filePathRelative)} is removed`)
+      handlePageUnlink(app, app.dir.source(filePathRelative))
+    })
+    watchers.push(pagesWatcher)
+
+    // watch user config file
+    if (userConfigPath) {
+      const configWatcher = chokidar.watch(userConfigPath, {
+        cwd: process.cwd(),
+        ignoreInitial: true,
+      })
+      configWatcher.on('change', (configFile) => {
+        logger.info(`config ${chalk.magenta(configFile)} is modified`)
+        restart()
+      })
+      watchers.push(configWatcher)
+    }
+
+    await app.pluginApi.hooks.onWatched.process(app, watchers, restart)
+  }
+
+  return dev
+}

packages/@vuepress/cli/src/commands/dev/dev.ts

@@ -1,4 +1,4 @@
-export * from './dev'
+export * from './createDev'
 export * from './handlePageAdd'
 export * from './handlePageChange'
 export * from './handlePageUnlink'

packages/@vuepress/cli/src/commands/dev/index.ts

@@ -1,3 +1,6 @@
 #!/usr/bin/env node
 
-require('@vuepress/cli/bin/vuepress')
+const { cli } = require('@vuepress/cli')
+
+// set default bundler
+cli({ bundler: '@vuepress/bundler-vite' })

packages/vuepress-vite/bin/vuepress.js

@@ -21,7 +21,8 @@
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "bin": {
-    "vuepress": "bin/vuepress.js"
+    "vuepress": "bin/vuepress.js",
+    "vuepress-vite": "bin/vuepress.js"
   },
   "files": [
     "bin",

packages/vuepress-vite/package.json

@@ -1,3 +1,6 @@
 #!/usr/bin/env node
 
-require('@vuepress/cli/bin/vuepress')
+const { cli } = require('@vuepress/cli')
+
+// set default bundler
+cli({ bundler: '@vuepress/bundler-webpack' })