valaxy 0.0.2 → 0.0.7

package/src/node/plugins/preset.ts

@@ -0,0 +1,174 @@
+
+import fs from 'fs'
+import type { PluginOption } from 'vite'
+
+import consola from 'consola'
+
+import MarkdownIt from 'markdown-it'
+import matter from 'gray-matter'
+
+import Vue from '@vitejs/plugin-vue'
+import Pages from 'vite-plugin-pages'
+import Layouts from 'vite-plugin-vue-layouts'
+import Components from 'unplugin-vue-components/vite'
+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 type { ResolvedValaxyOptions, ValaxyServerOptions } from '../options'
+import type { Mode } from '../vite'
+import { setupMarkdownPlugins } from '../markdown'
+import { createMarkdownPlugin, excerpt_separator } from './markdown'
+import { createUnocssPlugin } from './unocss'
+import { createConfigPlugin } from './extendConfig'
+import { createValaxyPlugin } from '.'
+
+export function ViteValaxyPlugins(
+  options: ResolvedValaxyOptions,
+  serverOptions: ValaxyServerOptions = {},
+  mode: Mode = 'dev',
+): (PluginOption | PluginOption[])[] | undefined {
+  const { clientRoot, themeRoot, userRoot } = options
+
+  const MarkdownPlugin = createMarkdownPlugin(options)
+  const UnocssPlugin = createUnocssPlugin(options)
+
+  const ValaxyPlugin = createValaxyPlugin(options, serverOptions)
+
+  const mdIt = new MarkdownIt({ html: true })
+  const _md = setupMarkdownPlugins(mdIt, options.config.markdownIt)
+
+  const roots = [clientRoot, themeRoot, userRoot]
+  return [
+    Vue({
+      include: [/\.vue$/, /\.md$/],
+      template: {
+        compilerOptions: {
+          isCustomElement: (tag) => {
+            return ['meting-js'].includes(tag)
+          },
+        },
+      },
+    }) as PluginOption,
+
+    ValaxyPlugin,
+    MarkdownPlugin,
+    createConfigPlugin(options),
+
+    // https://github.com/hannoeru/vite-plugin-pages
+    Pages({
+      extensions: ['vue', 'md'],
+      dirs: roots.map(root => `${root}/pages`),
+      /**
+       * we need get frontmatter before route, so write it in Pages.extendRoute
+       */
+      extendRoute(route) {
+        let path = route.component
+        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 } = 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}`)}`)
+        }
+
+        route.meta = Object.assign(route.meta, {
+          frontmatter: Object.assign({ date: new Date() }, data),
+          excerpt: excerpt ? mdIt.render(excerpt) : '',
+        })
+
+        // to refactor
+        // get active header by runtime query head, not render
+        mdIt.render(md)
+        route.meta.headers = _md.__data?.headers
+
+        // set default updated
+        if (route.meta.frontmatter.updated)
+          route.meta.frontmatter.updated = route.meta.frontmatter.date
+
+        // set layout
+        if (data.layout)
+          route.meta.layout = data.layout
+
+        return route
+      },
+    }),
+
+    // https://github.com/JohnCampionJr/vite-plugin-vue-layouts
+    Layouts({
+      layoutsDirs: roots.map(root => `${root}/layouts`),
+    }),
+
+    // https://github.com/antfu/unplugin-vue-components
+    Components({
+      extensions: ['vue', 'md'],
+
+      // allow auto import and register components used in markdown
+      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+
+      // allow override
+      allowOverrides: true,
+      // override: user -> theme -> client
+      // latter override former
+      dirs: roots.map(root => `${root}/components`),
+      dts: `${options.userRoot}/components.d.ts`,
+    }),
+
+    // https://github.com/antfu/unocss
+    // UnocssPlugin,
+    UnocssPlugin,
+
+    // https://github.com/antfu/vite-plugin-pwa
+    VitePWA({
+      registerType: 'autoUpdate',
+      includeAssets: ['favicon.svg', 'safari-pinned-tab.svg'],
+      manifest: {
+        name: 'Theme Yun',
+        short_name: 'Yun',
+        theme_color: '#ffffff',
+        icons: [
+          {
+            src: '/pwa-192x192.png',
+            sizes: '192x192',
+            type: 'image/png',
+          },
+          {
+            src: '/pwa-512x512.png',
+            sizes: '512x512',
+            type: 'image/png',
+          },
+          {
+            src: '/pwa-512x512.png',
+            sizes: '512x512',
+            type: 'image/png',
+            purpose: 'any maskable',
+          },
+        ],
+      },
+    }),
+
+    // https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n
+    VueI18n({
+      runtimeOnly: true,
+      compositionOnly: true,
+      include: roots.map(root => `${root}/locales/**`),
+    }) as PluginOption,
+
+    // https://github.com/antfu/vite-plugin-inspect
+    // Visit http://localhost:3333/__inspect/ to see the inspector
+    mode === 'dev' && Inspect(),
+  ]
+}

package/src/node/plugins/unocss.ts

@@ -0,0 +1,106 @@
+import defu from 'defu'
+import type { VitePluginConfig } from 'unocss/vite'
+import Unocss from 'unocss/vite'
+
+import {
+  presetAttributify,
+  presetIcons,
+  presetTypography,
+  presetUno,
+  presetWebFonts,
+  transformerDirectives,
+  transformerVariantGroup,
+} from 'unocss'
+import type { ValaxyConfig } from 'valaxy'
+import type { ThemeUserConfig } from 'valaxy-theme-yun/config'
+import type { ResolvedValaxyOptions } from '../options'
+
+export const createSafelist = (config: ValaxyConfig<ThemeUserConfig>) => {
+  const safeIcons: string[] = [
+    'i-ri-archive-line',
+    'i-ri-folder-2-line',
+    'i-ri-price-tag-3-line',
+
+    'i-ri-cloud-line',
+  ]
+
+  const safelist = 'animate-fade-in prose prose-sm m-auto text-left'.split(' ').concat([
+    'rotate-y-180',
+  ]).concat(safeIcons)
+  // generate icon safelist
+  if (config.social.length)
+    config.social.forEach(item => safelist.push(item.icon))
+
+  if (config.themeConfig.footer?.icon?.name)
+    safelist.push(config.themeConfig.footer?.icon?.name)
+
+  // sponsor icon
+  if (config.sponsor.methods.length)
+    config.sponsor.methods.forEach(item => safelist.push(item.icon))
+
+  const types = config.themeConfig.types
+  if (types) {
+    for (const type in types)
+      safelist.push(types[type].icon)
+  }
+
+  return safelist
+}
+
+export const createUnocssConfig = (options: ResolvedValaxyOptions) => {
+  const unocssConfig: VitePluginConfig = {
+    shortcuts: [
+      ['yun-main', 'lt-md:pl-0'],
+      ['yun-card', 'transition yun-transition shadow hover:shadow-lg'],
+      ['btn', 'px-4 py-1 rounded inline-block bg-sky-600 text-white cursor-pointer hover:bg-sky-700 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
+      ['icon-btn', 'inline-block cursor-pointer select-none opacity-75 transition duration-200 ease-in-out hover:opacity-100 hover:text-sky-600'],
+      ['val-card', 'transition shadow hover:shadow-lg'],
+    ],
+    presets: [
+      presetUno(),
+      presetAttributify(),
+      presetIcons({
+        scale: 1.2,
+        // warn: true,
+      }),
+      presetTypography(),
+      presetWebFonts({
+        fonts: {
+          serif: 'Noto Serif SC',
+          // sans: 'DM Sans',
+          // mono: 'DM Mono',
+        },
+      }),
+    ],
+    rules: [
+      // more see '~/styles/global/helper.scss'
+      ['yun-transition', {
+        'transition-duration': 'var(--yun-transition-duration)',
+      }],
+      ['yun-text-light', {
+        color: 'var(--yun-c-text-light)',
+      }],
+      ['font-serif', {
+        'font-family': 'var(--yun-font-serif)',
+      }],
+      ['font-sans', {
+        'font-family': 'var(--yun-font-sans)',
+      }],
+      ['font-mono', {
+        'font-family': 'var(--yun-font-mono)',
+      }],
+    ],
+    transformers: [
+      transformerDirectives(),
+      transformerVariantGroup(),
+    ],
+    safelist: createSafelist(options.config),
+  }
+
+  return defu(options.config.unocss, unocssConfig)
+}
+
+export const createUnocssPlugin = (options: ResolvedValaxyOptions) => {
+  const config = createUnocssConfig(options)
+  return Unocss(config)
+}

package/src/node/plugins/valaxy.ts

@@ -0,0 +1 @@
+export const VALAXY_CONFIG_ID = '@valaxyjs/config'

package/src/node/server.ts

@@ -0,0 +1,21 @@
+import type { InlineConfig } from 'vite'
+import { createServer as createViteServer, mergeConfig } from 'vite'
+
+import type { ResolvedValaxyOptions, ValaxyServerOptions } from './options'
+import { createViteConfig } from './vite'
+
+export async function createServer(
+  options: ResolvedValaxyOptions,
+  viteConfig: InlineConfig = {},
+  serverOptions: ValaxyServerOptions = {},
+) {
+  // default editor vscode
+  process.env.EDITOR = process.env.EDITOR || 'code'
+
+  const server = await createViteServer(mergeConfig(
+    viteConfig,
+    createViteConfig(options, serverOptions),
+  ))
+
+  return server
+}

package/src/node/shims.d.ts

@@ -0,0 +1,23 @@
+declare module 'markdown-it-attrs' {
+  const def: any
+  export default def
+}
+
+declare module 'markdown-it-emoji' {
+  const def: any
+  export default def
+}
+
+declare module 'markdown-it-table-of-contents' {
+  const def: any
+  export default def
+}
+
+declare module 'markdown-it-container' {
+  const def: any
+  export default def
+}
+
+declare module 'diacritics' {
+  export const remove: (str: string) => string
+}

package/src/node/utils/cli.ts

@@ -0,0 +1,105 @@
+
+import * as readline from 'readline'
+import path from 'path'
+import os from 'os'
+// import equal from 'fast-deep-equal'
+
+import chalk from 'chalk'
+import consola from 'consola'
+import type { InlineConfig, ViteDevServer } from 'vite'
+import { createServer } from '../server'
+import type { ResolvedValaxyOptions } from '../options'
+import { version } from '../../../package.json'
+import { createSafelist } from '../plugins/unocss'
+
+let server: ViteDevServer | undefined
+
+export function printInfo(options: ResolvedValaxyOptions, port?: number, remote?: string | boolean) {
+  console.log()
+  console.log(`  ${chalk.bold('🌌 Valaxy')}  ${chalk.blue(`v${version}`)}`)
+  console.log()
+  console.log(`${chalk.dim('  🪐 theme  ')} > ${(options.theme ? chalk.green(options.theme) : chalk.gray('none'))}`)
+  console.log(`  ${chalk.dim('📁')} ${chalk.dim(path.resolve(options.userRoot))}`)
+  if (port) {
+    console.log()
+    console.log(`${chalk.dim('  Preview   ')} > ${chalk.cyan(`http://localhost:${chalk.bold(port)}/`)}`)
+
+    if (remote) {
+      Object.values(os.networkInterfaces())
+        .forEach(v => (v || [])
+          .filter(details => details.family === 'IPv4' && !details.address.includes('127.0.0.1'))
+          .forEach(({ address }) => {
+            console.log(`${chalk.dim('  Network   ')} > ${chalk.blue(`http://${address}:${chalk.bold(port)}/`)}`)
+          }),
+        )
+    }
+
+    console.log()
+    console.log(`${chalk.dim('  shortcuts ')} > ${chalk.underline('r')}${chalk.dim('estart | ')}${chalk.underline('o')}${chalk.dim('pen | ')}${chalk.underline('e')}${chalk.dim('dit')}`)
+  }
+  console.log()
+}
+
+export async function initServer(options: ResolvedValaxyOptions, viteConfig: InlineConfig) {
+  if (server)
+    await server.close()
+
+  try {
+    const safelist = createSafelist(options.config).concat(options.config.unocss.safelist || [])
+
+    server = await createServer(options, viteConfig, {
+      onConfigReload(newConfig, config) {
+        let reload = false
+
+        const iconChanged = newConfig.social.some((item, i) => {
+          return !safelist.includes(item.icon) && item.icon !== config.social[i].icon
+        })
+
+        if (iconChanged) {
+          consola.info('Find new icon, reload server...')
+          consola.info(`If you do not want to reload it, write icon name in ${chalk.green('config.unocss.safelist')}.`)
+          consola.info('For example: ["i-ri-cloud-line"]')
+          console.log()
+          reload = true
+        }
+
+        if (reload)
+          initServer(options, viteConfig)
+      },
+    })
+    await server.listen()
+  }
+  catch (e) {
+    consola.error('failed to start server. error:\n')
+    console.error(e)
+    process.exit(1)
+  }
+}
+
+/**
+ * bind shortcut for terminal
+ */
+export function bindShortcut(SHORTCUTS: { name: string; fullName: string; action: () => void }[]) {
+  process.stdin.resume()
+  process.stdin.setEncoding('utf8')
+  readline.emitKeypressEvents(process.stdin)
+  if (process.stdin.isTTY)
+    process.stdin.setRawMode(true)
+
+  process.stdin.on('keypress', (str, key) => {
+    if (key.ctrl && key.name === 'c') {
+      process.exit()
+    }
+    else {
+      const [sh] = SHORTCUTS.filter(item => item.name === str)
+      if (sh) {
+        try {
+          sh.action()
+        }
+        catch (err) {
+          console.error(`Failed to execute shortcut ${sh.fullName}`, err)
+        }
+      }
+    }
+  })
+}

package/src/node/utils/index.ts

@@ -0,0 +1,26 @@
+import { dirname } from 'path'
+import consola from 'consola'
+
+export function slash(str: string) {
+  return str.replace(/\\/g, '/')
+}
+
+export function ensurePrefix(prefix: string, str: string) {
+  if (!str.startsWith(prefix))
+    return prefix + str
+  return str
+}
+
+export function toAtFS(path: string) {
+  return `/@fs${ensurePrefix('/', slash(path))}`
+}
+
+export function resolveImportPath(importName: string) {
+  try {
+    return dirname(require.resolve(importName))
+  }
+  catch { }
+
+  consola.error(`Failed to resolve package ${importName}`)
+  throw new Error(`Failed to resolve package ${importName}`)
+}

package/src/node/vite.ts

@@ -0,0 +1,83 @@
+import path from 'path'
+
+import generateSitemap from 'vite-ssg-sitemap'
+import type { InlineConfig } from 'vite'
+import { searchForWorkspaceRoot } from 'vite'
+import type { ResolvedValaxyOptions, ValaxyServerOptions } from './options'
+
+import { ViteValaxyPlugins } from './plugins/preset'
+import { VALAXY_CONFIG_ID } from './plugins/valaxy'
+
+export type Mode = 'dev' | 'build'
+
+export function createViteConfig(options: ResolvedValaxyOptions, serverOptions: ValaxyServerOptions = {}, mode: Mode = 'dev'): InlineConfig {
+  const { configFile } = options
+
+  const viteConfig: InlineConfig = {
+    // remove vue-i18n warnings
+    // https://vue-i18n.intlify.dev/guide/advanced/optimization.html#reduce-bundle-size-with-feature-build-flags
+    // https://github.com/antfu/vitesse/issues/131
+    // https://github.com/intlify/vue-i18n-next/blob/dab6db19a1ef917425939275a41dfde9b6c61fe9/packages/vue-i18n-core/src/misc.ts#L20
+    // I create a issue https://github.com/intlify/vue-i18n-next/issues/961
+    // define: {
+    //   __FEATURE_FULL_INSTALL__: 'false',
+    //   __FEATURE_LEGACY_API__: 'false',
+    //   __VUE_I18N_FULL_INSTALL__: 'false',
+    //   __VUE_I18N_LEGACY_API__: 'false',
+    // },
+
+    resolve: {
+      alias: {
+        '@/': `${options.userRoot}/`,
+        '~/': `${options.clientRoot}/`,
+        '@valaxyjs/client': `${options.clientRoot}/`,
+        'valaxy/package.json': `${path.resolve(options.clientRoot, '../../package.json')}`,
+        'valaxy': `${path.resolve(options.clientRoot, '..')}`,
+        [VALAXY_CONFIG_ID]: `/${VALAXY_CONFIG_ID}`,
+        '@valaxyjs/core': `${path.resolve(options.clientRoot, '../core')}`,
+        [`valaxy-theme-${options.theme}`]: `${path.resolve(options.themeRoot)}/`,
+      },
+    },
+
+    root: options.clientRoot,
+    // todo user base
+    // base: '/',
+
+    plugins: ViteValaxyPlugins(options, serverOptions, mode),
+
+    server: {
+      fs: {
+        allow: [
+          searchForWorkspaceRoot(options.clientRoot),
+          searchForWorkspaceRoot(options.userRoot),
+          searchForWorkspaceRoot(options.themeRoot),
+        ],
+      },
+    },
+
+    optimizeDeps: {
+      entries: [path.resolve(options.clientRoot, 'main.ts'), configFile],
+
+      include: [
+        'vue',
+        'vue-router',
+        '@vueuse/core',
+        '@vueuse/head',
+      ],
+      exclude: [
+        'vue-demi',
+      ],
+    },
+  }
+
+  if (mode === 'build') {
+    // https://github.com/antfu/vite-ssg
+    viteConfig.ssgOptions = {
+      script: 'async',
+      formatting: 'minify',
+      onFinished() { generateSitemap() },
+    }
+  }
+
+  return viteConfig
+}