valaxy 0.4.0 → 0.6.1

package/dist/node/index.d.ts

@@ -1,12 +1,12 @@
 import * as vite from 'vite';
 import { InlineConfig } from 'vite';
-import { V as ValaxyConfig } from '../config-de04677b.js';
+import { V as ValaxyConfig } from '../config-112ac884.js';
 import 'type-fest';
 import 'unocss/vite';
 import 'markdown-it';
+import 'shiki';
 import 'markdown-it-anchor';
 import 'katex';
-import 'vite-plugin-md';
 
 interface ResolvedValaxyOptions {
     mode: 'dev' | 'build';
@@ -36,6 +36,7 @@ interface ResolvedValaxyOptions {
      * config file path
      */
     configFile: string;
+    pages: string[];
 }
 interface ValaxyServerOptions {
     onConfigReload?: (newConfig: ValaxyConfig, config: ValaxyConfig) => void;

package/dist/node/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});var _chunkHRARZPSAjs = require('../chunk-HRARZPSA.js');require('../chunk-V3BMKLEW.js');exports.createServer = _chunkHRARZPSAjs.g;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});var _chunkZHHNO5RKjs = require('../chunk-ZHHNO5RK.js');require('../chunk-U5OMNIOK.js');exports.createServer = _chunkZHHNO5RKjs.f;

package/dist/node/index.mjs

@@ -1 +1 @@
-import{g as o}from"../chunk-N6HD5SHF.mjs";import"../chunk-6LIOFBAA.mjs";export{o as createServer};
+import{f as o}from"../chunk-HMUGSKPK.mjs";import"../chunk-EAN2KU6W.mjs";export{o as createServer};

package/{src/index.ts → index.ts}

@@ -1,2 +1,3 @@
 export * from './client'
 export * from './types'
+export * from './config'

package/{src/node → node}/cli.ts

@@ -9,7 +9,8 @@ import openBrowser from 'open'
 import consola from 'consola'
 
 import { yellow } from 'kolorist'
-import { version } from '../../package.json'
+import { version } from '../package.json'
+import { findFreePort } from './utils/net'
 import { resolveOptions } from './options'
 import { bindShortcut, initServer, printInfo } from './utils/cli'
 
@@ -59,7 +60,7 @@ cli.command(
     if (!fs.existsSync(path.resolve(root, 'pages')))
       process.exit(0)
 
-    const port = userPort || 4859
+    const port = await findFreePort(userPort || 4859)
     const options = await resolveOptions({ userRoot: root })
 
     const viteConfig: InlineConfig = {

package/node/config.ts

@@ -0,0 +1,156 @@
+// import { loadConfig } from 'c12'
+import fs from 'fs'
+import { loadConfig } from 'unconfig'
+import defu from 'defu'
+import type { ValaxyConfig } from '../types'
+import type { ValaxyEntryOptions } from './options'
+
+const defaultValaxyConfig: ValaxyConfig = {
+  url: '/',
+  lang: 'en',
+  title: 'Valaxy Blog',
+  description: 'A blog generated by Valaxy.',
+  subtitle: 'Next Generation Static Blog Framework.',
+  author: {
+    avatar: 'https://cdn.jsdelivr.net/gh/YunYouJun/yun/images/meme/yun-good-with-bg.jpg',
+    email: 'me@yunyoujun.cn',
+    link: 'https://www.yunyoujun.cn',
+    name: 'YunYouJun',
+    status: {
+      emoji: '😊',
+      message: 'All at sea.',
+    },
+  },
+  favicon: '/favicon.svg',
+  feed: {
+    name: '',
+    favicon: 'favicon.svg',
+  },
+  social: [],
+
+  lastUpdated: true,
+
+  license: {
+    enabled: true,
+    language: '',
+    type: 'by-nc-sa',
+  },
+
+  sponsor: {
+    enable: true,
+    title: '我很可爱，请给我钱',
+    methods: [
+      {
+        name: '支付宝',
+        url: 'https://cdn.jsdelivr.net/gh/YunYouJun/cdn/img/donate/alipay-qrcode.jpg',
+        color: '#00A3EE',
+        icon: 'i-ri-alipay-line',
+      },
+      {
+        name: 'QQ 支付',
+        url: 'https://cdn.jsdelivr.net/gh/YunYouJun/cdn/img/donate/qqpay-qrcode.png',
+        color: '#12B7F5',
+        icon: 'i-ri-qq-line',
+      },
+      {
+        name: '微信支付',
+        url: 'https://cdn.jsdelivr.net/gh/YunYouJun/cdn/img/donate/wechatpay-qrcode.jpg',
+        color: '#2DC100',
+        icon: 'i-ri-wechat-pay-line',
+      },
+
+    ],
+  },
+
+  search: {
+    enable: true,
+    algolia: {
+      enable: false,
+      appId: '',
+      apiKey: '',
+      indexName: '',
+    },
+  },
+
+  comment: {
+    waline: {
+      enable: false,
+      serverURL: '',
+    },
+    twikoo: {
+      enable: false,
+      envId: 'https://twikoo.vercel.app',
+    },
+  },
+
+  features: {
+    katex: true,
+  },
+
+  theme: 'yun',
+  themeConfig: {
+    pkg: {
+      name: '',
+      version: '',
+    },
+  },
+
+  unocss: {},
+
+  // markdown: {
+  //   excerpt: '<!-- more -->',
+  // },
+
+  markdownIt: {
+    toc: {
+      includeLevel: [1, 2, 3, 4],
+      listType: 'ol',
+    },
+    katex: {},
+  },
+}
+
+// for user config
+export async function resolveConfig(options: ValaxyEntryOptions = {}) {
+  // c12 merge array twice, so i deprecated it
+  // const { config, configFile } = await loadConfig<ValaxyConfig>({
+  //   name: 'valaxy',
+  //   defaults: defaultValaxyConfig,
+  // })
+
+  const { config: userConfig, sources } = await loadConfig<ValaxyConfig>({
+    sources: [
+      {
+        files: 'valaxy.config',
+        extensions: ['ts', 'js', 'mjs', 'cjs', 'json'],
+      },
+    ],
+    merge: false,
+  })
+  const configFile = sources[0]
+  const config = defu(userConfig, defaultValaxyConfig)
+
+  const theme = options.theme || config.theme || 'yun'
+
+  try {
+    const { defaultThemeConfig } = await import(`valaxy-theme-${theme}`)
+    config.themeConfig = defu(config.themeConfig, defaultThemeConfig)
+  }
+  catch (e) {
+    console.error(`valaxy-theme-${theme} doesn't have default config`)
+  }
+
+  try {
+    const pkg = fs.readFileSync(require.resolve(`valaxy-theme-${theme}/package.json`), 'utf-8')
+    config.themeConfig.pkg = JSON.parse(pkg)
+  }
+  catch (e) {
+    console.error(`valaxy-theme-${theme} doesn't have package.json`)
+  }
+
+  return {
+    config,
+    configFile,
+    theme,
+  }
+}

package/node/markdown/highlight.ts

@@ -0,0 +1,38 @@
+import { getHighlighter } from 'shiki'
+import consola from 'consola'
+import type { ThemeOptions } from '../markdown'
+
+export async function highlight(theme: ThemeOptions = 'material-palenight') {
+  const themes = typeof theme === 'string' ? [theme] : [theme.dark, theme.light]
+  const highlighter = await getHighlighter({ themes })
+  const preRE = /^<pre.*?>/
+
+  return (str: string, lang: string) => {
+    lang = lang || 'text'
+
+    // https://stackoverflow.com/questions/22268952/what-is-the-difference-between-yaml-and-yml-extension
+    // use yaml better
+
+    // adaptive
+    if (lang === 'yml') {
+      lang = 'yaml'
+      consola.warn('[shiki] It is recommended to use `.yaml` instead of `.yml`.')
+    }
+
+    if (typeof theme === 'string') {
+      return highlighter
+        .codeToHtml(str, { lang, theme })
+        .replace(preRE, '<pre v-pre>')
+    }
+
+    const dark = highlighter
+      .codeToHtml(str, { lang, theme: theme.dark })
+      .replace(preRE, '<pre v-pre class="vp-code-dark">')
+
+    const light = highlighter
+      .codeToHtml(str, { lang, theme: theme.light })
+      .replace(preRE, '<pre v-pre class="vp-code-light">')
+
+    return dark + light
+  }
+}

package/{src/node → node}/markdown/index.ts

@@ -1,4 +1,6 @@
-import type MarkdownIt from 'markdown-it'
+import MarkdownIt from 'markdown-it'
+
+import type { Theme } from 'shiki'
 
 import Anchor from 'markdown-it-anchor'
 import Emoji from 'markdown-it-emoji'
@@ -8,23 +10,16 @@ import TaskLists from 'markdown-it-task-lists'
 import attrs from 'markdown-it-attrs'
 
 import type { KatexOptions } from 'katex'
+import type { Header } from '../../types'
 import Katex from './markdown-it/katex'
 import { containerPlugin } from './markdown-it/container'
-// import { headingPlugin } from './markdown-it/headings'
+import { headingPlugin } from './markdown-it/headings'
 import { slugify } from './slugify'
 import { parseHeader } from './markdown-it/parseHeader'
 import { highlight } from './highlight'
 import { highlightLinePlugin, preWrapperPlugin } from './markdown-it/highlightLines'
 
-export interface Header {
-  level: number
-  title: string
-  slug: string
-  /**
-   * i18n
-   */
-  lang?: string
-}
+export type ThemeOptions = Theme | { light: Theme; dark: Theme }
 
 export interface MarkdownParsedData {
   hoistedTags?: string[]
@@ -32,6 +27,8 @@ export interface MarkdownParsedData {
   headers?: Header[]
 }
 export interface MarkdownRenderer extends MarkdownIt {
+  __path: string
+  __relativePath: string
   __data: MarkdownParsedData
 }
 
@@ -46,12 +43,13 @@ export interface MarkdownOptions extends MarkdownIt.Options {
     [key: string]: any
   }
   katex?: KatexOptions
+  /**
+   * shiki
+   */
+  theme?: ThemeOptions
 }
 
-export function setupMarkdownPlugins(md: MarkdownIt, mdOptions: MarkdownOptions = {}) {
-  md.set({
-    highlight,
-  })
+export async function setupMarkdownPlugins(md: MarkdownIt, mdOptions: MarkdownOptions = {}) {
   md
     .use(highlightLinePlugin)
     .use(preWrapperPlugin)
@@ -59,7 +57,7 @@ export function setupMarkdownPlugins(md: MarkdownIt, mdOptions: MarkdownOptions
     // conflict with {% %}
     .use(attrs)
     // generate toc in client
-    // .use(headingPlugin, mdOptions?.toc?.includeLevel)
+    .use(headingPlugin, mdOptions?.toc?.includeLevel)
     // .use(lineNumberPlugin)
   // https://github.com/arve0/markdown-it-attrs
   // add classes
@@ -93,3 +91,19 @@ export function setupMarkdownPlugins(md: MarkdownIt, mdOptions: MarkdownOptions
 
   return md as MarkdownRenderer
 }
+
+export const createMarkdownRenderer = async (
+  srcDir: string,
+  options: MarkdownOptions = {},
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  base = '/',
+): Promise<MarkdownRenderer> => {
+  const md = MarkdownIt({
+    html: true,
+    linkify: true,
+    highlight: await highlight(options.theme),
+    ...options,
+  }) as MarkdownRenderer
+  await setupMarkdownPlugins(md)
+  return md
+}

package/{src/node → node}/markdown/markdown-it/highlightLines.ts

@@ -65,7 +65,7 @@ export const preWrapperPlugin = (md: MarkdownIt) => {
     const [tokens, idx] = args
     const token = tokens[idx]
     const rawCode = fence(...args)
-    return `<div class="language-${token.info.trim()}">${rawCode}</div>`
+    return `<div class="language-${token.info.trim()}"><span class="copy"></span>${rawCode}</div>`
   }
 }
 

package/node/markdown/markdownToVue.ts

@@ -0,0 +1,274 @@
+// copy from vitepress
+import fs from 'fs'
+import path from 'path'
+import c from 'picocolors'
+import matter from 'gray-matter'
+import LRUCache from 'lru-cache'
+import _debug from 'debug'
+import { getGitTimestamp, slash, transformObject } from '../utils'
+import { EXTERNAL_URL_RE } from '../../shared'
+import type { HeadConfig, PageData } from '../../types'
+import { deeplyParseHeader } from './markdown-it/parseHeader'
+import { createMarkdownRenderer } from '.'
+import type { MarkdownOptions } from '.'
+
+const debug = _debug('vitepress:md')
+const cache = new LRUCache<string, MarkdownCompileResult>({ max: 1024 })
+const includesRE = /<!--\s*@include:\s*(.*?)\s*-->/g
+
+export interface MarkdownCompileResult {
+  vueSrc: string
+  pageData: PageData
+  deadLinks: string[]
+  includes: string[]
+}
+
+const inferTitle = (frontmatter: Record<string, any>, content: string) => {
+  if (frontmatter.title)
+    return deeplyParseHeader(frontmatter.title)
+
+  const match = content.match(/^\s*#+\s+(.*)/m)
+
+  if (match)
+    return deeplyParseHeader(match[1].trim())
+
+  return ''
+}
+
+const getHeadMetaContent = (
+  head: HeadConfig[],
+  name: string,
+): string | undefined => {
+  if (!head || !head.length)
+    return undefined
+
+  const meta = head.find(([tag, attrs = {}]) => {
+    return tag === 'meta' && attrs.name === name && attrs.content
+  })
+
+  return meta && meta[1].content
+}
+
+const inferDescription = (frontmatter: Record<string, any>) => {
+  const { description, head } = frontmatter
+
+  if (description !== undefined)
+    return description
+
+  return (head && getHeadMetaContent(head, 'description')) || ''
+}
+
+export async function createMarkdownToVueRenderFn(
+  srcDir: string,
+  options: MarkdownOptions = {},
+  pages: string[],
+  userDefines: Record<string, any> | undefined,
+  isBuild = false,
+  base = '/',
+  includeLastUpdatedData = false,
+) {
+  const md = await createMarkdownRenderer(srcDir, options, base)
+
+  pages = pages.map(p => slash(p.replace(/\.md$/, '')))
+
+  const userDefineRegex = userDefines
+    ? new RegExp(
+        `\\b(${Object.keys(userDefines)
+          .map(key => key.replace(/[-[\]/{}()*+?.\\^$|]/g, '\\$&'))
+          .join('|')})`,
+        'g',
+    )
+    : null
+
+  return async (
+    src: string,
+    file: string,
+    publicDir: string,
+  ): Promise<MarkdownCompileResult> => {
+    const relativePath = slash(path.relative(srcDir, file))
+    const dir = path.dirname(file)
+
+    const cached = cache.get(src)
+    if (cached) {
+      debug(`[cache hit] ${relativePath}`)
+      return cached
+    }
+
+    const start = Date.now()
+
+    // resolve includes
+    const includes: string[] = []
+    src = src.replace(includesRE, (_, m1) => {
+      const includePath = path.join(dir, m1)
+      const content = fs.readFileSync(includePath, 'utf-8')
+      includes.push(slash(includePath))
+      return content
+    })
+
+    const { content, data: frontmatter } = matter(src)
+
+    // reset state before render
+    md.__path = file
+    md.__relativePath = relativePath
+
+    let html = md.render(content)
+    const data = md.__data
+
+    if (isBuild) {
+      // avoid env variables being replaced by vite
+      html = html
+        .replace(/\bimport\.meta/g, 'import.<wbr/>meta')
+        .replace(/\bprocess\.env/g, 'process.<wbr/>env')
+
+      // also avoid replacing vite user defines
+      if (userDefineRegex) {
+        html = html.replace(
+          userDefineRegex,
+          _ => `${_[0]}<wbr/>${_.slice(1)}`,
+        )
+      }
+    }
+
+    // validate data.links
+    const deadLinks: string[] = []
+    const recordDeadLink = (url: string) => {
+      console.warn(
+        c.yellow(
+          `\n(!) Found dead link ${c.cyan(url)} in file ${c.white(c.dim(file))}`,
+        ),
+      )
+      deadLinks.push(url)
+    }
+
+    if (data.links) {
+      const dir = path.dirname(file)
+      for (let url of data.links) {
+        if (/\.(?!html|md)\w+($|\?)/i.test(url))
+          continue
+
+        if (url.replace(EXTERNAL_URL_RE, '').startsWith('//localhost:')) {
+          recordDeadLink(url)
+          continue
+        }
+
+        url = url.replace(/[?#].*$/, '').replace(/\.(html|md)$/, '')
+        if (url.endsWith('/'))
+          url += 'index'
+        const resolved = decodeURIComponent(
+          slash(
+            url.startsWith('/')
+              ? url.slice(1)
+              : path.relative(srcDir, path.resolve(dir, url)),
+          ),
+        )
+        if (
+          !pages.includes(resolved)
+          && !fs.existsSync(path.resolve(dir, publicDir, `${resolved}.html`))
+        )
+          recordDeadLink(url)
+      }
+    }
+
+    const pageData: PageData = {
+      title: inferTitle(frontmatter, content),
+      titleTemplate: frontmatter.titleTemplate,
+      description: inferDescription(frontmatter),
+      frontmatter,
+      headers: data.headers || [],
+      relativePath,
+      path: path.join(srcDir, relativePath),
+    }
+
+    if (includeLastUpdatedData)
+      pageData.lastUpdated = await getGitTimestamp(file)
+
+    const pageComponent = 'ValaxyMain'
+
+    function generateSlots() {
+      const slots = [
+        'main-header',
+        'main-header-after',
+        'main-nav',
+        'main-content',
+        'footer',
+        'aside',
+        'aside-custom',
+      ]
+      const slotsText = slots.map(s => `<template #${s}><slot name="${s}" /></template>`).join('')
+      return slotsText
+    }
+    const vueSrc
+      = `${genPageDataCode(data.hoistedTags || [], pageData).join('\n')
+      }\n<template><${pageComponent} :frontmatter="frontmatter" :data="data">
+        <template #main-content-md>${html}</template>
+        ${generateSlots()}
+        <slot />
+      </${pageComponent}></template>`
+
+    debug(`[render] ${file} in ${Date.now() - start}ms.`)
+
+    const result = {
+      vueSrc,
+      pageData,
+      deadLinks,
+      includes,
+    }
+    cache.set(src, result)
+    return result
+  }
+}
+
+const scriptRE = /<\/script>/
+const scriptLangTsRE = /<\s*script[^>]*\blang=['"]ts['"][^>]*/
+const scriptSetupRE = /<\s*script[^>]*\bsetup\b[^>]*/
+const scriptClientRE = /<\s*script[^>]*\bclient\b[^>]*/
+const defaultExportRE = /((?:^|\n|;)\s*)export(\s*)default/
+const namedDefaultExportRE = /((?:^|\n|;)\s*)export(.+)as(\s*)default/
+
+function genPageDataCode(tags: string[], data: PageData) {
+  const code = ''
+
+  const existingScriptIndex = tags.findIndex((tag) => {
+    return (
+      scriptRE.test(tag)
+      && !scriptSetupRE.test(tag)
+      && !scriptClientRE.test(tag)
+    )
+  })
+
+  const isUsingTS = tags.findIndex(tag => scriptLangTsRE.test(tag)) > -1
+
+  const exportScript = `
+  export default {
+    name:'${data.relativePath}',
+    data() {
+      return {
+        frontmatter:${transformObject(data.frontmatter)},
+        data: ${transformObject(data)}
+      }
+    }
+  }`
+
+  if (existingScriptIndex > -1) {
+    const tagSrc = tags[existingScriptIndex]
+    // user has <script> tag inside markdown
+    // if it doesn't have export default it will error out on build
+    const hasDefaultExport
+      = defaultExportRE.test(tagSrc) || namedDefaultExportRE.test(tagSrc)
+    tags[existingScriptIndex] = tagSrc.replace(
+      scriptRE,
+      `${code
+        + (hasDefaultExport
+          ? ''
+          : `\n${exportScript}`)
+        }</script>`,
+    )
+  }
+  else {
+    tags.unshift(
+      `<script ${isUsingTS ? 'lang="ts"' : ''}>${code}\n${exportScript}</script>`,
+    )
+  }
+
+  return tags
+}