feat: vitepress init command (#2020)

close #1252

.gitignore

@@ -10,6 +10,7 @@
 .vscode
 dist
 cache
+temp
 examples-temp
 node_modules
 pnpm-global

.prettierignore

@@ -3,3 +3,4 @@
 dist
 pnpm-lock.yaml
 cache
+template

__tests__/e2e/vitestGlobalSetup.ts

@@ -1,8 +1,8 @@
 import getPort from 'get-port'
-import { Server } from 'net'
 import { chromium, type BrowserServer } from 'playwright-chromium'
-import { type ViteDevServer } from 'vite'
 import { build, createServer, serve } from 'vitepress'
+import type { ViteDevServer } from 'vite'
+import type { Server } from 'net'
 
 let browserServer: BrowserServer
 let server: ViteDevServer | Server

__tests__/init/init.test.ts

@@ -0,0 +1,98 @@
+import { chromium, type Browser, type Page } from 'playwright-chromium'
+import { fileURLToPath } from 'url'
+import path from 'path'
+import fs from 'fs-extra'
+import {
+  scaffold,
+  build,
+  createServer,
+  serve,
+  ScaffoldThemeType,
+  type ScaffoldOptions
+} from 'vitepress'
+import type { ViteDevServer } from 'vite'
+import type { Server } from 'net'
+import getPort from 'get-port'
+
+let browser: Browser
+let page: Page
+
+beforeAll(async () => {
+  browser = await chromium.connect(process.env['WS_ENDPOINT']!)
+  page = await browser.newPage()
+})
+
+afterAll(async () => {
+  await page.close()
+  await browser.close()
+})
+
+const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), 'temp')
+
+async function testVariation(options: ScaffoldOptions) {
+  fs.removeSync(root)
+  scaffold({
+    ...options,
+    root
+  })
+
+  let server: ViteDevServer | Server
+  const port = await getPort()
+
+  async function goto(path: string) {
+    await page.goto(`http://localhost:${port}${path}`)
+    await page.waitForSelector('#app div')
+  }
+
+  if (process.env['VITE_TEST_BUILD']) {
+    await build(root)
+    server = (await serve({ root, port })).server
+  } else {
+    server = await createServer(root, { port })
+    await server!.listen()
+  }
+
+  try {
+    await goto('/')
+    expect(await page.textContent('h1')).toMatch('My Awesome Project')
+
+    await page.click('a[href="/markdown-examples.html"]')
+    await page.waitForSelector('pre code')
+    expect(await page.textContent('h1')).toMatch('Markdown Extension Examples')
+
+    await goto('/')
+    expect(await page.textContent('h1')).toMatch('My Awesome Project')
+
+    await page.click('a[href="/api-examples.html"]')
+    await page.waitForSelector('pre code')
+    expect(await page.textContent('h1')).toMatch('Runtime API Examples')
+  } finally {
+    fs.removeSync(root)
+    if ('ws' in server) {
+      await server.close()
+    } else {
+      await new Promise<void>((resolve, reject) => {
+        server.close((error) => (error ? reject(error) : resolve()))
+      })
+    }
+  }
+}
+
+const themes = [
+  ScaffoldThemeType.Default,
+  ScaffoldThemeType.DefaultCustom,
+  ScaffoldThemeType.Custom
+]
+const usingTs = [false, true]
+
+for (const theme of themes) {
+  for (const useTs of usingTs) {
+    test(`${theme}${useTs ? ` + TypeScript` : ``}`, () =>
+      testVariation({
+        root: '.',
+        theme,
+        useTs,
+        injectNpmScripts: false
+      }))
+  }
+}

__tests__/init/package.json

@@ -0,0 +1,7 @@
+{
+  "private": true,
+  "type": "module",
+  "devDependencies": {
+    "vitepress": "workspace:*"
+  }
+}

__tests__/init/vitest.config.ts

@@ -0,0 +1,23 @@
+import { dirname, resolve } from 'path'
+import { fileURLToPath } from 'url'
+import { defineConfig } from 'vitest/config'
+
+const dir = dirname(fileURLToPath(import.meta.url))
+
+const timeout = 60_000
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      node: resolve(dir, '../../src/node')
+    }
+  },
+  test: {
+    watchExclude: ['**/node_modules/**', '**/temp/**'],
+    globalSetup: ['__tests__/init/vitestGlobalSetup.ts'],
+    testTimeout: timeout,
+    hookTimeout: timeout,
+    teardownTimeout: timeout,
+    globals: true
+  }
+})

__tests__/init/vitestGlobalSetup.ts

@@ -0,0 +1,17 @@
+import { chromium, type BrowserServer } from 'playwright-chromium'
+
+let browserServer: BrowserServer
+
+export async function setup() {
+  browserServer = await chromium.launchServer({
+    headless: !process.env.DEBUG,
+    args: process.env.CI
+      ? ['--no-sandbox', '--disable-setuid-sandbox']
+      : undefined
+  })
+  process.env['WS_ENDPOINT'] = browserServer.wsEndpoint()
+}
+
+export async function teardown() {
+  await browserServer.close()
+}

package.json

@@ -30,6 +30,7 @@
     "bin",
     "dist",
     "types",
+    "template",
     "client.d.ts",
     "theme.d.ts"
   ],
@@ -62,10 +63,12 @@
     "format": "prettier --check --write .",
     "format-fail": "prettier --check .",
     "check": "run-s format-fail build test",
-    "test": "run-p --aggregate-output test-unit test-preview test-build",
+    "test": "run-p --aggregate-output test-unit test-preview test-build test-init",
     "test-unit": "vitest run -r __tests__/unit",
     "test-preview": "vitest run -r __tests__/e2e",
     "test-build": "VITE_TEST_BUILD=1 pnpm test-preview",
+    "test-init": "vitest run -r __tests__/init",
+    "test-init-build": "VITE_TEST_BUILD=1 pnpm test-init",
     "debug-preview": "DEBUG=1 vitest -r __tests__/e2e",
     "debug-build": "VITE_TEST_BUILD=1 pnpm debug-preview",
     "unit-dev": "vitest -r __tests__/unit",
@@ -77,7 +80,10 @@
     "docs-debug": "node --inspect-brk ./bin/vitepress dev docs",
     "docs-build": "run-s build docs-build-only",
     "docs-build-only": "node ./bin/vitepress build docs",
-    "docs-preview": "node ./bin/vitepress preview docs"
+    "docs-preview": "node ./bin/vitepress preview docs",
+    "docs:dev": "vitepress dev /Users/evan/Vue/vitepress/__tests__/init/temp",
+    "docs:build": "vitepress build /Users/evan/Vue/vitepress/__tests__/init/temp",
+    "docs:preview": "vitepress preview /Users/evan/Vue/vitepress/__tests__/init/temp"
   },
   "dependencies": {
     "@docsearch/css": "^3.3.3",
@@ -91,6 +97,7 @@
     "vue": "^3.2.47"
   },
   "devDependencies": {
+    "@clack/prompts": "^0.6.1",
     "@mdit-vue/plugin-component": "^0.12.0",
     "@mdit-vue/plugin-frontmatter": "^0.12.0",
     "@mdit-vue/plugin-headers": "^0.12.0",
@@ -132,6 +139,7 @@
     "fs-extra": "^11.1.0",
     "get-port": "^6.1.2",
     "lint-staged": "^13.1.2",
+    "lodash.template": "^4.5.0",
     "lru-cache": "^7.17.0",
     "markdown-it": "^13.0.1",
     "markdown-it-anchor": "^8.6.7",

src/node/cli.ts

@@ -2,6 +2,7 @@ import minimist from 'minimist'
 import c from 'picocolors'
 import { createLogger } from 'vite'
 import { build, createServer, serve } from '.'
+import { init } from './init/init'
 import { version } from '../../package.json'
 
 const argv: any = minimist(process.argv.slice(2))
@@ -48,6 +49,8 @@ if (!command || command === 'dev') {
       )
       process.exit(1)
     })
+  } else if (command === 'init') {
+    init()
   } else {
     createLogger().error(c.red(`unknown command "${command}".`))
     process.exit(1)

src/node/index.ts

@@ -3,6 +3,7 @@ export * from './server'
 export * from './markdown'
 export * from './build/build'
 export * from './serve/serve'
+export * from './init/init'
 
 // shared types
 export type {