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 {