@varlet/vite-plugins 3.8.7 → 3.8.8-alpha.1740224609678

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/vite-plugins",
-  "version": "3.8.7",
+  "version": "3.8.8-alpha.1740224609678",
   "description": "vite plugins of varlet",
   "keywords": [
     "vite",
@@ -20,13 +20,16 @@
   "type": "module",
   "main": "lib/index.js",
   "module": "lib/index.js",
+  "files": [
+    "lib"
+  ],
   "dependencies": {
     "ejs": "^3.1.8",
     "fs-extra": "^9.0.1",
     "highlight.js": "^10.7.2",
     "markdown-it": "^12.2.3",
     "pinyin-pro": "3.17.0",
-    "@varlet/shared": "3.8.7"
+    "@varlet/shared": "3.8.8-alpha.1740224609678"
   },
   "devDependencies": {
     "@types/ejs": "^3.1.1",
@@ -34,8 +37,10 @@
     "@types/markdown-it": "^12.2.3",
     "@types/node": "^18.7.20",
     "tsup": "7.2.0",
-    "typescript": "5.3.3",
-    "vite": "5.4.6"
+    "typescript": "5.3.3"
+  },
+  "peerDependencies": {
+    "vite": "6.1.1"
   },
   "scripts": {
     "build": "tsup src/index.ts --format esm --out-dir=lib --dts --clean",

package/src/copy.ts

@@ -1,30 +0,0 @@
-import fse from 'fs-extra'
-import type { Plugin } from 'vite'
-
-const { copySync, copyFileSync } = fse
-
-export interface CopyPath {
-  from: string
-  to: string
-  type: 'folder' | 'file'
-}
-
-export interface CopyOptions {
-  paths: CopyPath[]
-}
-
-export function copy(options: CopyOptions): Plugin {
-  return {
-    name: 'vite-plugin-varlet-copy',
-
-    buildStart() {
-      options.paths.forEach((copyPath) => {
-        try {
-          ;(copyPath.type === 'folder' ? copySync : copyFileSync)(copyPath.from, copyPath.to)
-        } catch (e: any) {
-          this.warn(e)
-        }
-      })
-    },
-  }
-}

package/src/html.ts

@@ -1,20 +0,0 @@
-import ejs from 'ejs'
-import type { Plugin } from 'vite'
-
-export interface HtmlOptions {
-  data?: Record<string, string | string[] | Record<string, any>>
-}
-
-export function html(options: HtmlOptions): Plugin {
-  return {
-    name: 'vite-plugin-varlet-html',
-
-    transformIndexHtml: {
-      order: 'pre',
-
-      handler(html) {
-        return ejs.render(html, options.data)
-      },
-    },
-  }
-}

package/src/index.ts

@@ -1,4 +0,0 @@
-export * from './markdown.js'
-export * from './html.js'
-export * from './inlineCss.js'
-export * from './copy.js'

package/src/inlineCss.ts

@@ -1,42 +0,0 @@
-import fse from 'fs-extra'
-import type { Plugin } from 'vite'
-
-const { pathExistsSync, writeFileSync, readFileSync, removeSync } = fse
-
-export interface InlineCssOptions {
-  cssFile: string
-  jsFile: string
-  onEnd?(): void
-}
-
-export function inlineCss(options: InlineCssOptions): Plugin {
-  return {
-    name: 'vite-plugin-varlet-inline-css',
-
-    apply: 'build',
-
-    closeBundle() {
-      const { cssFile, jsFile, onEnd } = options
-
-      if (!pathExistsSync(cssFile)) {
-        this.warn('css file cannot found')
-        return
-      }
-
-      if (!pathExistsSync(jsFile)) {
-        this.warn('js file cannot found')
-        return
-      }
-
-      const cssCode = readFileSync(cssFile, 'utf-8')
-      const jsCode = readFileSync(jsFile, 'utf-8')
-      const injectCode = `;(function(){var style=document.createElement('style');style.type='text/css';\
-style.rel='stylesheet';style.appendChild(document.createTextNode(\`${cssCode.replace(/\\/g, '\\\\')}\`));\
-var head=document.querySelector('head');head.appendChild(style)})();`
-
-      writeFileSync(jsFile, `${injectCode}${jsCode}`)
-      removeSync(cssFile)
-      onEnd?.()
-    },
-  }
-}

package/src/markdown.ts

@@ -1,155 +0,0 @@
-import { kebabCase } from '@varlet/shared'
-import hljs from 'highlight.js'
-import markdownIt from 'markdown-it'
-import { pinyin } from 'pinyin-pro'
-import type { Plugin } from 'vite'
-
-const includeChinese = (value: string) => /[\u4e00-\u9fa5]/.test(value)
-
-function transformHash(hash: string) {
-  return (includeChinese(hash) ? pinyin(hash, { toneType: 'num' }) : hash).replaceAll(' ', '')
-}
-
-function htmlWrapper(html: string) {
-  const matches = html.matchAll(/<h3>(.*?)<\/h3>/g)
-  const hGroup = html
-    .replace(/<h3>/g, () => {
-      const hash = transformHash(matches.next().value![1])
-
-      return `:::<h3 id="${hash}"><router-link to="#${hash}">#</router-link>`
-    })
-    .replace(/<h2/g, ':::<h2')
-    .split(':::')
-
-  const cardGroup = hGroup
-    .map((fragment) => (fragment.includes('<h3') ? `<div class="card">${fragment}</div>` : fragment))
-    .join('')
-
-  return cardGroup.replace(/<code>/g, '<code v-pre>')
-}
-
-function extractComponents(source: string) {
-  const componentRE = /import (.+) from ['"].+['"]/
-  const importRE = /import .+ from ['"].+['"]/g
-  const vueRE = /```vue((.|\r|\n)*?)```/g
-  const imports: string[] = []
-  const components: string[] = []
-
-  source = source.replace(vueRE, (_, p1) => {
-    const partImports = p1.match(importRE)
-
-    const partComponents = partImports?.map((importer: string) => {
-      importer = importer.replace(/(\n|\r)/g, '')
-      const component = importer.replace(componentRE, '$1')
-      !imports.includes(importer) && imports.push(importer)
-      !components.includes(component) && components.push(component)
-
-      return `<${kebabCase(component)} />`
-    })
-
-    return partComponents ? `<div class="varlet-component-preview">${partComponents.join('\n')}</div>` : ''
-  })
-
-  return {
-    imports,
-    components,
-    source,
-  }
-}
-
-function injectCodeExample(source: string) {
-  const codeRE = /(<pre class="hljs">(.|\r|\n)*?<\/pre>)/g
-
-  return source.replace(codeRE, (str) => {
-    const flags = [
-      '// playground-ignore\n',
-      '<span class="hljs-meta">#</span><span class="bash"> playground-ignore</span>\n',
-      '<span class="hljs-comment">// playground-ignore</span>\n',
-      '<span class="hljs-comment">/* playground-ignore */</span>\n',
-      '<span class="hljs-comment">&lt;!-- playground-ignore --&gt;</span>\n',
-    ]
-
-    const attr = flags.some((flag) => str.includes(flag)) ? 'playground-ignore' : ''
-
-    str = flags.reduce((str, flag) => str.replace(flag, ''), str)
-
-    return `<var-site-code-example ${attr}>${str}</var-site-code-example>`
-  })
-}
-
-function highlight(str: string, lang: string, style?: string) {
-  let link = ''
-
-  if (style) {
-    link = '<link class="hljs-style" rel="stylesheet" href="' + style + '"/>'
-  }
-
-  if (lang && hljs.getLanguage(lang)) {
-    return (
-      '<pre class="hljs"><code>' +
-      link +
-      hljs.highlight(str, { language: lang, ignoreIllegals: true }).value +
-      '</code></pre>'
-    )
-  }
-
-  return ''
-}
-
-function markdownToVue(source: string, options: MarkdownOptions) {
-  const { source: vueSource, imports, components } = extractComponents(source)
-  const md = markdownIt({
-    html: true,
-    highlight: (str, lang) => highlight(str, lang, options.style),
-  })
-  let templateString = htmlWrapper(md.render(vueSource))
-  templateString = templateString.replace(/process.env/g, '<span>process.env</span>')
-  templateString = injectCodeExample(templateString)
-
-  return `
-<template><div class="varlet-site-doc">${templateString}</div></template>
-
-<script>
-${imports.join('\n')}
-
-export default {
-  components: {
-    ${components.join(',')}
-  }
-}
-</script>
-  `
-}
-
-export interface MarkdownOptions {
-  style?: string
-}
-
-export function markdown(options: MarkdownOptions): Plugin {
-  return {
-    name: 'vite-plugin-varlet-markdown',
-
-    enforce: 'pre',
-
-    transform(source, id) {
-      if (!/\.md$/.test(id)) {
-        return
-      }
-
-      try {
-        return markdownToVue(source, options)
-      } catch (e: any) {
-        this.error(e)
-      }
-    },
-
-    handleHotUpdate(ctx) {
-      if (!/\.md$/.test(ctx.file)) {
-        return
-      }
-
-      const { read } = ctx
-      ctx.read = async () => markdownToVue(await read(), options)
-    },
-  }
-}

package/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "target": "esnext",
-    "outDir": "./lib"
-  },
-  "include": ["src/**/*"]
-}