valaxy 0.3.1 → 0.3.4

package/dist/node/index.d.ts

@@ -1,6 +1,6 @@
 import * as vite from 'vite';
 import { InlineConfig } from 'vite';
-import { V as ValaxyConfig } from '../config-408070e9.js';
+import { V as ValaxyConfig } from '../config-97204b79.js';
 import 'type-fest';
 import 'unocss/vite';
 import 'markdown-it';

package/dist/node/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});var _chunkPQWGL22Ejs = require('../chunk-PQWGL22E.js');var _chunkWNLPZSARjs = require('../chunk-WNLPZSAR.js');_chunkWNLPZSARjs.f.call(void 0, );exports.createServer = _chunkPQWGL22Ejs.i;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});var _chunk32YG63VMjs = require('../chunk-32YG63VM.js');var _chunkQIXBXHEKjs = require('../chunk-QIXBXHEK.js');_chunkQIXBXHEKjs.i.call(void 0, );exports.createServer = _chunk32YG63VMjs.g;

package/dist/node/index.mjs

@@ -1 +1 @@
-import{i as r}from"../chunk-F4NM2FOU.mjs";import{f as o}from"../chunk-R2IXLA5A.mjs";o();export{r as createServer};
+import{g as r}from"../chunk-REH4P5X4.mjs";import{i as o}from"../chunk-T3K5KZOK.mjs";o();export{r as createServer};

package/package.json

@@ -1,14 +1,21 @@
 {
   "name": "valaxy",
-  "version": "0.3.1",
+  "version": "0.3.4",
   "description": "📄 Vite & Vue powered static blog generator.",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
   "keywords": [
     "vite",
     "vue",
     "blog"
   ],
+  "license": "MIT",
+  "author": {
+    "email": "me@yunyoujun.cn",
+    "name": "YunYouJun",
+    "url": "https://www.yunyoujun.cn"
+  },
+  "repository": "https://github.com/YunYouJun/valaxy",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "exports": {
     ".": "./src/index.ts",
     "./*": "./*"
@@ -17,44 +24,25 @@
     "vala": "./bin/valaxy.js",
     "valaxy": "./bin/valaxy.js"
   },
-  "author": {
-    "email": "me@yunyoujun.cn",
-    "name": "YunYouJun",
-    "url": "https://www.yunyoujun.cn"
-  },
-  "license": "MIT",
   "homepage": "https://valaxy.yyj.moe",
-  "repository": "https://github.com/YunYouJun/valaxy",
-  "devDependencies": {
-    "@types/katex": "^0.14.0",
-    "@types/markdown-it-link-attributes": "^3.0.1",
-    "@types/nprogress": "^0.2.0",
-    "@types/yargs": "^17.0.10",
-    "chalk": "4",
-    "cross-env": "^7.0.3",
-    "debug": "^4.3.4",
-    "diacritics": "^1.3.0",
-    "https-localhost": "^4.7.1",
-    "markdown-it-attrs": "^4.1.3",
-    "type-fest": "^2.12.2",
-    "vue-tsc": "^0.34.11"
-  },
   "dependencies": {
     "@ctrl/tinycolor": "^3.4.1",
     "@iconify-json/carbon": "^1.1.4",
     "@iconify-json/ri": "^1.1.1",
     "@intlify/vite-plugin-vue-i18n": "^3.4.0",
-    "@vitejs/plugin-vue": "^2.3.2",
-    "@vueuse/core": "^8.4.1",
+    "@vitejs/plugin-vue": "^2.3.3",
+    "@vueuse/core": "^8.4.2",
     "@vueuse/head": "^0.7.6",
     "consola": "^2.15.3",
     "critters": "^0.0.16",
-    "dayjs": "^1.11.1",
+    "dayjs": "^1.11.2",
     "escape-html": "^1.0.3",
     "fast-deep-equal": "^3.1.3",
     "feed": "^4.2.2",
     "katex": "^0.15.3",
-    "markdown-it-anchor": "^8.6.2",
+    "kolorist": "^1.5.1",
+    "markdown-it-anchor": "^8.6.4",
+    "markdown-it-attrs": "^4.1.4",
     "markdown-it-container": "^3.0.0",
     "markdown-it-emoji": "^2.0.2",
     "markdown-it-link-attributes": "^4.0.0",
@@ -68,24 +56,37 @@
     "sass": "^1.51.0",
     "star-markdown-css": "^0.3.3",
     "unconfig": "^0.3.4",
-    "unocss": "^0.32.12",
-    "unplugin-vue-components": "^0.19.3",
-    "vite": "^2.9.8",
+    "unocss": "^0.33.4",
+    "unplugin-vue-components": "^0.19.5",
+    "vite": "^2.9.9",
     "vite-plugin-inspect": "^0.5.0",
-    "vite-plugin-md": "^0.13.0",
+    "vite-plugin-md": "^0.13.1",
     "vite-plugin-pages": "^0.23.0",
     "vite-plugin-pwa": "^0.12.0",
     "vite-plugin-vue-layouts": "^0.6.0",
-    "vite-ssg": "^0.20.0",
+    "vite-ssg": "0.19.2",
     "vite-ssg-sitemap": "0.2.6",
     "vue": "^3.2.33",
-    "vue-demi": "^0.12.5",
     "vue-i18n": "^9.1.10",
     "vue-router": "^4.0.15",
-    "yargs": "^17.4.1"
+    "yargs": "^17.5.0"
+  },
+  "devDependencies": {
+    "@types/katex": "^0.14.0",
+    "@types/markdown-it-link-attributes": "^3.0.1",
+    "@types/nprogress": "^0.2.0",
+    "@types/yargs": "^17.0.10",
+    "debug": "^4.3.4",
+    "diacritics": "^1.3.0",
+    "https-localhost": "^4.7.1",
+    "type-fest": "^2.12.2",
+    "vue-tsc": "^0.34.13"
+  },
+  "engines": {
+    "node": ">=14.0.0"
   },
   "scripts": {
-    "build": "tsup --splitting",
+    "build": "rimraf dist && tsup --splitting",
     "dev": "tsup --watch --splitting",
     "lint": "eslint \"**/*.{vue,ts,js}\"",
     "preview": "vite preview",

package/src/client/components/ValaxyToc.vue

@@ -1,12 +1,11 @@
 <script lang="ts" setup>
-import { computed, ref } from 'vue'
+import { onMounted, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRoute } from 'vue-router'
 
+import type { Header } from '../../node/markdown'
 import { useActiveSidebarLinks } from '~/composables'
-
-const route = useRoute()
-const headers = computed(() => route.meta.headers)
+import { useConfig } from '~/config'
 
 const container = ref()
 const marker = ref()
@@ -21,6 +20,53 @@ function getStylesByLevel(level: number) {
 
 const { locale } = useI18n()
 
+const config = useConfig()
+
+function useHeaders() {
+  const headers = ref<Header[]>([])
+  const route = useRoute()
+
+  function generateHeaders() {
+    headers.value = []
+
+    const content = document.querySelector('.markdown-body')
+    const levels = config.value.markdownIt.toc!.includeLevel!.map(level => `h${level}`)
+
+    content?.querySelectorAll(levels as any).forEach((header) => {
+      headers.value.push({
+        level: header.tagName.toLowerCase().replace('h', ''),
+        title: header.textContent.replace('#', ''),
+        slug: header.id,
+        lang: header.lang || locale.value,
+      })
+    })
+  }
+
+  watch(() => route.path, () => {
+    generateHeaders()
+  })
+
+  onMounted(() => {
+    generateHeaders()
+  })
+
+  return {
+    headers,
+    generateHeaders,
+  }
+}
+
+const { headers, generateHeaders } = useHeaders()
+
+if (import.meta.hot) {
+  import.meta.hot.on('valaxy:md-update', () => {
+    setTimeout(() => {
+      generateHeaders()
+      // 400ms transition
+    }, 600)
+  })
+}
+
 // todo mobile toc widget
 </script>
 

package/src/client/locales/en.yml

@@ -47,14 +47,14 @@ post:
     author: Post author
     link: Post link
     license_title: Copyright Notice
-    license_content: "All articles in this blog are licensed under {0} unless otherwise stated."
+    license_content: 'All articles in this blog are licensed under {0} unless otherwise stated.'
 
 # page:
 #   totally: Totally
 #   tags: tags
 
 footer:
-  powered: "Powered by {0}"
+  powered: 'Powered by {0}'
   theme: Theme
   total_views: Total Views
   total_visitors: Total Visitors
@@ -66,24 +66,24 @@ counter:
   albums:
     zero: No album
     one: 1 album in total
-    other: "%d albums in total"
+    other: '%d albums in total'
   photos:
     zero: No photo
     one: 1 photo in total
-    other: "%d photos in total"
+    other: '%d photos in total'
 
 category:
   uncategorized: Uncategorized
 
 search:
   placeholder: Searching...
-  empty: "We didn't find any results for the search: {query}."
-  hits_time: "{hits} results found in {time} ms"
+  empty: 'We didn''t find any results for the search: {query}.'
+  hits_time: '{hits} results found in {time} ms'
 
 symbol:
-  comma: ", "
-  period: ". "
-  colon: ": "
+  comma: ', '
+  period: '. '
+  colon: ': '
 
 reward:
   donate: Donate

package/src/client/locales/zh-CN.yml

@@ -47,13 +47,13 @@ post:
     author: 本文作者
     link: 本文链接
     license_title: 版权声明
-    license_content: "本博客所有文章除特别声明外，均默认采用 {0} 许可协议。"
+    license_content: '本博客所有文章除特别声明外，均默认采用 {0} 许可协议。'
 
 # page:
 #   totally: 共有
 #   tags: 标签
 footer:
-  powered: "由 {0} 驱动"
+  powered: '由 {0} 驱动'
   theme: 主题
   total_views: 总访问量
   total_visitors: 总访客量
@@ -65,24 +65,24 @@ counter:
   albums:
     zero: 暂无相册
     one: 共计 1 个相册
-    other: "共计 %d 个相册"
+    other: '共计 %d 个相册'
   photos:
     zero: 暂无照片
     one: 共计 1 张照片
-    other: "共计 %d 张照片"
+    other: '共计 %d 张照片'
 
 category:
   uncategorized: 未分类
 
 search:
   placeholder: 搜索...
-  empty: "找不到您查询的内容: {query}"
-  hits_time: "找到 {hits} 条结果（用时 {time} 毫秒）"
+  empty: '找不到您查询的内容: {query}'
+  hits_time: '找到 {hits} 条结果（用时 {time} 毫秒）'
 
 symbol:
-  comma: "，"
-  period: "。"
-  colon: "："
+  comma: ，
+  period: 。
+  colon: ：
 
 reward:
   donate: 打赏

package/src/client/pages/index.vue

@@ -1,3 +1,8 @@
 <template>
   <PostList />
 </template>
+
+<route lang="yaml">
+meta:
+  layout: home
+</route>

package/src/client/styles/palette.scss

@@ -63,7 +63,7 @@ $dark: map.merge(
     "border-color": #e6e6e6,
 
     "c-bg": #1a1a1a,
-    "c-bg-light": #22252e,
+    "c-bg-light": #1d1e1f,
     "c-bg-dark": #1a1a1a,
 
     "c-text": #f2f2f2,

package/src/node/cli.ts

@@ -8,6 +8,7 @@ import openBrowser from 'open'
 
 import consola from 'consola'
 
+import { yellow } from 'kolorist'
 import { version } from '../../package.json'
 import { resolveOptions } from './options'
 import { bindShortcut, initServer, printInfo } from './utils/cli'
@@ -142,7 +143,7 @@ cli.command(
     }
 
     if (ssg) {
-      consola.info('use vite-ssg to do ssg build...')
+      consola.info(`use ${yellow('vite-ssg')} to do ssg build...`)
 
       try {
         await ssgBuild(options, viteConfig)

package/src/node/markdown/check.ts

@@ -0,0 +1,14 @@
+import { cyan, red, yellow } from 'kolorist'
+import consola from 'consola'
+
+/**
+ * check Markdown content
+ * @param content
+ */
+export function checkMd(content: string, path: string) {
+  if (content.includes('{%') && content.includes('%}')) {
+    consola.error(
+      `${`${path}\n`}        Please ${red('remove')} ${cyan('{% %}')}, because it conflicts with ${yellow('markdown-it-attrs')}.`,
+    )
+  }
+}

package/src/node/markdown/index.ts

@@ -8,13 +8,13 @@ import TaskLists from 'markdown-it-task-lists'
 import attrs from 'markdown-it-attrs'
 
 import type { KatexOptions } from 'katex'
-import Katex from '../markdown/markdown-it-katex'
-import { containerPlugin } from '../markdown/markdown-it-container'
-import { headingPlugin } from '../markdown/headings'
+import Katex from './markdown-it/katex'
+import { containerPlugin } from './markdown-it/container'
+// import { headingPlugin } from './markdown-it/headings'
 import { slugify } from './slugify'
-import { parseHeader } from './parseHeader'
+import { parseHeader } from './markdown-it/parseHeader'
 import { highlight } from './highlight'
-import { highlightLinePlugin, preWrapperPlugin } from './highlightLines'
+import { highlightLinePlugin, preWrapperPlugin } from './markdown-it/highlightLines'
 
 export interface Header {
   level: number
@@ -41,7 +41,10 @@ export interface MarkdownOptions extends MarkdownIt.Options {
     permalink?: Anchor.AnchorOptions['permalink']
   }
   // https://github.com/Oktavilla/markdown-it-table-of-contents
-  toc?: any
+  toc?: {
+    includeLevel?: number[]
+    [key: string]: any
+  }
   katex?: KatexOptions
 }
 
@@ -53,8 +56,10 @@ export function setupMarkdownPlugins(md: MarkdownIt, mdOptions: MarkdownOptions
     .use(highlightLinePlugin)
     .use(preWrapperPlugin)
     .use(containerPlugin)
+    // conflict with {% %}
     .use(attrs)
-    .use(headingPlugin, mdOptions?.toc?.includeLevel)
+    // generate toc in client
+    // .use(headingPlugin, mdOptions?.toc?.includeLevel)
     // .use(lineNumberPlugin)
   // https://github.com/arve0/markdown-it-attrs
   // add classes

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

@@ -1,8 +1,8 @@
 // ref vitepress
 import type MarkdownIt from 'markdown-it'
-import type { MarkdownRenderer } from '../markdown'
+import type { MarkdownRenderer } from '..'
+import { slugify } from '../slugify'
 import { deeplyParseHeader } from './parseHeader'
-import { slugify } from './slugify'
 
 export const headingPlugin = (md: MarkdownIt, include = [1, 2, 3, 4]) => {
   md.renderer.rules.heading_open = (tokens, i, options, env, self) => {
@@ -16,7 +16,8 @@ export const headingPlugin = (md: MarkdownIt, include = [1, 2, 3, 4]) => {
       const headers = data.headers || (data.headers = [])
       // remove {} after head
       const leftDeli = content.indexOf('{')
-      const title = content.slice(0, leftDeli).trim()
+      const title = leftDeli === -1 ? content : content.slice(0, leftDeli).trim()
+
       const matched = content.match(/\{lang=\"(.*)\"\}/)
       const lang = matched ? matched[1] : ''
       headers.push({

package/src/node/plugins/extendConfig.ts

@@ -27,15 +27,7 @@ export function createConfigPlugin(options: ResolvedValaxyOptions): Plugin {
           entries: [resolve(options.clientRoot, 'main.ts'), options.configFile],
 
           include: [
-            'vue',
-            'vue-router',
-            '@vueuse/core',
-            '@vueuse/head',
             'dayjs',
-            'nprogress',
-          ],
-          exclude: [
-            'vue-demi',
           ],
         },
       }

package/src/node/plugins/markdown.ts

@@ -1,13 +1,10 @@
-import path from 'path'
-import Markdown from 'vite-plugin-md'
+import Markdown, { meta } from 'vite-plugin-md'
 
 import type { Plugin } from 'vite'
 import type { ResolvedValaxyOptions } from '../options'
 
-import type { MarkdownRenderer } from '../markdown'
 import { setupMarkdownPlugins } from '../markdown'
-import { slash } from '../utils'
-// import { useRoute } from 'vue-router'
+import { checkMd } from '../markdown/check'
 
 export type ViteMdOptions = Parameters<typeof Markdown>[0]
 
@@ -16,8 +13,6 @@ export const excerpt_separator = '<!-- more -->'
 // https://github.com/antfu/vite-plugin-md
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export function createMarkdownPlugin(options: ResolvedValaxyOptions): Plugin[] {
-  let _md: MarkdownRenderer
-
   const mdOptions = options.config.markdownIt
 
   const defaultOptions: ViteMdOptions = {
@@ -29,33 +24,35 @@ export function createMarkdownPlugin(options: ResolvedValaxyOptions): Plugin[] {
 
     excerpt: excerpt_separator,
 
-    builders: [
-      // avoid conflict with markdown-it-anchor link
-      // link(),
-      // seems bug, override frontmatter
-      // meta(),
-    ],
+    frontmatterPreprocess: meta() as any,
 
     markdownItSetup(md) {
       if (mdOptions.config)
         mdOptions.config(md)
 
-      _md = setupMarkdownPlugins(md, mdOptions)
+      setupMarkdownPlugins(md, mdOptions)
+    },
+
+    transforms: {
+      before: (code, id) => {
+        checkMd(code, id)
+
+        code.replace('{%', '\{\%')
+        code.replace('%}', '\%\}')
+        return code
+      },
     },
   }
+
   return [Markdown(Object.assign(defaultOptions, options.config.markdown)), {
     name: 'valaxy:md',
     handleHotUpdate(ctx) {
       const { file, server } = ctx
       // send headers
-      if (file.endsWith('.md') && _md && _md.__data) {
+      if (file.endsWith('.md')) {
         server.ws.send({
           type: 'custom',
-          event: 'valaxy:pageHeaders',
-          data: {
-            path: `/${slash(path.relative(`${options.userRoot}/pages`, file))}`,
-            pageHeaders: _md.__data.headers,
-          },
+          event: 'valaxy:md-update',
         })
       }
     },

package/src/node/plugins/preset.ts

@@ -14,7 +14,7 @@ import { VitePWA } from 'vite-plugin-pwa'
 import VueI18n from '@intlify/vite-plugin-vue-i18n'
 import Inspect from 'vite-plugin-inspect'
 
-import chalk from 'chalk'
+import { dim, yellow } from 'kolorist'
 import type { ResolvedValaxyOptions, ValaxyServerOptions } from '../options'
 import { setupMarkdownPlugins } from '../markdown'
 import { createMarkdownPlugin, excerpt_separator } from './markdown'
@@ -39,7 +39,7 @@ export async function ViteValaxyPlugins(
   const ValaxyPlugin = createValaxyPlugin(options, serverOptions)
 
   const mdIt = new MarkdownIt({ html: true })
-  const _md = setupMarkdownPlugins(mdIt, options.config.markdownIt)
+  setupMarkdownPlugins(mdIt, options.config.markdownIt)
 
   const roots = [clientRoot, themeRoot, userRoot]
 
@@ -92,7 +92,6 @@ export async function ViteValaxyPlugins(
     }),
 
     ValaxyPlugin,
-    MarkdownPlugin,
     createConfigPlugin(options),
 
     ThemePlugin(options.config.themeConfig),
@@ -109,22 +108,20 @@ export async function ViteValaxyPlugins(
         if (!route.meta)
           route.meta = {}
 
-        if (route.path === '/')
-          route.meta.layout = 'home'
-
         roots.forEach((root) => {
           const pagePath = root + route.component
           if (fs.existsSync(pagePath))
             path = pagePath
         })
+
         const md = fs.readFileSync(path, 'utf-8')
-        const { data, excerpt, content } = matter(md, { excerpt_separator })
+        const { data, excerpt } = matter(md, { excerpt_separator })
 
         // warn for post frontmatter
         if (route.path.startsWith('/posts/')) {
           route.meta.layout = 'post'
           if (!data.date)
-            consola.warn(`You forgot to write ${chalk.yellow('date')} for post: ${chalk.dim(`${route.component}`)}`)
+            consola.warn(`You forgot to write ${yellow('date')} for post: ${dim(`${route.component}`)}`)
         }
 
         route.meta = Object.assign(route.meta, {
@@ -132,11 +129,6 @@ export async function ViteValaxyPlugins(
           excerpt: excerpt ? mdIt.render(excerpt) : '',
         })
 
-        // to refactor
-        // get active header by runtime query head, not render
-        mdIt.render(content)
-        route.meta.headers = _md.__data?.headers
-
         // set default updated
         if (route.meta.frontmatter.updated)
           route.meta.frontmatter.updated = route.meta.frontmatter.date
@@ -148,7 +140,6 @@ export async function ViteValaxyPlugins(
         return route
       },
     }),
-
     // https://github.com/JohnCampionJr/vite-plugin-vue-layouts
     Layouts({
       layoutsDirs: roots.map(root => `${root}/layouts`),
@@ -176,6 +167,8 @@ export async function ViteValaxyPlugins(
     // UnocssPlugin,
     UnocssPlugin,
 
+    ...MarkdownPlugin,
+
     // https://github.com/antfu/vite-plugin-pwa
     VitePWA({
       registerType: 'autoUpdate',

package/src/node/plugins/unocss.ts

@@ -62,6 +62,7 @@ export const createUnocssConfig = async (options: ResolvedValaxyOptions) => {
         // warn: true,
       }),
       presetTypography(),
+      // todo, add unocss config it
       presetWebFonts({
         fonts: {
           serif: [

package/src/node/rss.ts

@@ -1,5 +1,5 @@
 import { dirname } from 'path'
-import chalk from 'chalk'
+import { cyan, dim } from 'kolorist'
 
 import fg from 'fast-glob'
 import fs from 'fs-extra'
@@ -37,7 +37,7 @@ export async function build(options: ResolvedValaxyOptions) {
     link: options.config.author.link,
   }
 
-  consola.info(`RSS Site Url: ${chalk.cyan(siteUrl)}`)
+  consola.info(`RSS Site Url: ${cyan(siteUrl)}`)
 
   const ccVersion = (config.license.type === 'zero') ? '1.0' : '4.0'
   const feedOptions: FeedOptions = {
@@ -64,12 +64,12 @@ export async function build(options: ResolvedValaxyOptions) {
 
       // not add to posts
       if (!data.date) {
-        consola.warn(`Do you forget to write date for ${chalk.dim(i)}`)
+        consola.warn(`Do you forget to write date for ${dim(i)}`)
         return false
       }
 
       if (data.draft) {
-        consola.warn(`Ignore draft post: ${chalk.dim(i)}`)
+        consola.warn(`Ignore draft post: ${dim(i)}`)
         return false
       }