From fac49e8dbbe1cc69ae4e9f82db22ab4b2e137462 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Mon, 27 Apr 2020 17:46:23 -0400
Subject: [PATCH] refactor: structure

---
 src/index.ts                                 |  2 +-
 src/markdown/{index.ts => markdown.ts}       | 38 ++++++++++----------
 src/{ => markdown}/markdownToVue.ts          | 16 +++++----
 src/markdown/{ => plugins}/component.ts      |  0
 src/markdown/{ => plugins}/containers.ts     |  0
 src/markdown/{ => plugins}/highlight.ts      |  0
 src/markdown/{ => plugins}/highlightLines.ts |  0
 src/markdown/{ => plugins}/hoist.ts          |  5 ++-
 src/markdown/{ => plugins}/lineNumbers.ts    |  0
 src/markdown/{ => plugins}/link.ts           |  5 +--
 src/markdown/{ => plugins}/preWrapper.ts     |  0
 src/markdown/{ => plugins}/slugify.ts        |  0
 src/markdown/{ => plugins}/snippet.ts        |  0
 src/{ => server}/resolver.ts                 |  4 +--
 src/{ => server}/server.ts                   |  4 +--
 15 files changed, 41 insertions(+), 33 deletions(-)
 rename src/markdown/{index.ts => markdown.ts} (74%)
 rename src/{ => markdown}/markdownToVue.ts (76%)
 rename src/markdown/{ => plugins}/component.ts (100%)
 rename src/markdown/{ => plugins}/containers.ts (100%)
 rename src/markdown/{ => plugins}/highlight.ts (100%)
 rename src/markdown/{ => plugins}/highlightLines.ts (100%)
 rename src/markdown/{ => plugins}/hoist.ts (61%)
 rename src/markdown/{ => plugins}/lineNumbers.ts (100%)
 rename src/markdown/{ => plugins}/link.ts (93%)
 rename src/markdown/{ => plugins}/preWrapper.ts (100%)
 rename src/markdown/{ => plugins}/slugify.ts (100%)
 rename src/markdown/{ => plugins}/snippet.ts (100%)
 rename src/{ => server}/resolver.ts (83%)
 rename src/{ => server}/server.ts (93%)

diff --git a/src/index.ts b/src/index.ts
index 37183651..79007b9d 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1 +1 @@
-export * from './server'
+export * from './server/server'
diff --git a/src/markdown/index.ts b/src/markdown/markdown.ts
similarity index 74%
rename from src/markdown/index.ts
rename to src/markdown/markdown.ts
index 6a5ea21f..aa378562 100644
--- a/src/markdown/index.ts
+++ b/src/markdown/markdown.ts
@@ -1,15 +1,15 @@
 import MarkdownIt from 'markdown-it'
 import { parseHeaders } from '../utils/parseHeaders'
-import { highlight } from './highlight'
-import { slugify } from './slugify'
-import { highlightLinePlugin } from './highlightLines'
-import { lineNumberPlugin } from './lineNumbers'
-import { componentPlugin } from './component'
-import { containerPlugin } from './containers'
-import { snippetPlugin } from './snippet'
-import { hoistPlugin } from './hoist'
-import { preWrapperPlugin } from './preWrapper'
-import { linkPlugin } from './link'
+import { highlight } from './plugins/highlight'
+import { slugify } from './plugins/slugify'
+import { highlightLinePlugin } from './plugins/highlightLines'
+import { lineNumberPlugin } from './plugins/lineNumbers'
+import { componentPlugin } from './plugins/component'
+import { containerPlugin } from './plugins/containers'
+import { snippetPlugin } from './plugins/snippet'
+import { hoistPlugin } from './plugins/hoist'
+import { preWrapperPlugin } from './plugins/preWrapper'
+import { linkPlugin } from './plugins/link'
 
 const emoji = require('markdown-it-emoji')
 const anchor = require('markdown-it-anchor')
@@ -28,8 +28,13 @@ export interface MarkdownOpitons extends MarkdownIt.Options {
   externalLinks?: Record<string, string>
 }
 
+export interface MarkdownParsedData {
+  hoistedTags?: string[]
+  links?: string[]
+}
+
 export interface MarkdownRenderer {
-  __data?: any
+  __data: MarkdownParsedData
   render: (src: string, env?: any) => { html: string; data: any }
 }
 
@@ -91,13 +96,7 @@ export const createMarkdownRenderer = (
     md.use(lineNumberPlugin)
   }
 
-  dataReturnable(md)
-
-  return md as any
-}
-
-export const dataReturnable = (md: MarkdownIt) => {
-  // override render to allow custom plugins return data
+  // wrap render so that we can return both the html and extracted data.
   const render = md.render
   const wrappedRender: MarkdownRenderer['render'] = (src) => {
     (md as any).__data = {}
@@ -107,6 +106,7 @@ export const dataReturnable = (md: MarkdownIt) => {
       data: (md as any).__data
     }
   }
-
   ;(md as any).render = wrappedRender
+
+  return md as any
 }
diff --git a/src/markdownToVue.ts b/src/markdown/markdownToVue.ts
similarity index 76%
rename from src/markdownToVue.ts
rename to src/markdown/markdownToVue.ts
index 3b3e9f12..51354fd0 100644
--- a/src/markdownToVue.ts
+++ b/src/markdown/markdownToVue.ts
@@ -1,14 +1,17 @@
 import path from 'path'
-import { createMarkdownRenderer, MarkdownOpitons } from './markdown/index'
+import { createMarkdownRenderer, MarkdownOpitons } from './markdown'
 import LRUCache from 'lru-cache'
 
+const matter = require('gray-matter')
 const debug = require('debug')('vitepress:md')
 const cache = new LRUCache<string, string>({ max: 1024 })
 
-const matter = require('gray-matter')
-
-export function createMarkdownFn(root: string, options: MarkdownOpitons = {}) {
+export function createMarkdownToVueRenderFn(
+  root: string,
+  options: MarkdownOpitons = {}
+) {
   const md = createMarkdownRenderer(options)
+
   return (src: string, file: string) => {
     file = path.relative(root, file)
     const cached = cache.get(src)
@@ -21,9 +24,10 @@ export function createMarkdownFn(root: string, options: MarkdownOpitons = {}) {
     const { content, data } = matter(src)
     const { html } = md.render(content)
 
-    // TODO make use of data
+    // TODO validate links?
 
-    const vueSrc = `<template>${html}</template>`
+    const vueSrc =
+      `<template>${html}</template>` + (data.hoistedTags || []).join('\n')
     debug(`[render] ${file} in ${Date.now() - start}ms.`, data)
     cache.set(src, vueSrc)
     return vueSrc
diff --git a/src/markdown/component.ts b/src/markdown/plugins/component.ts
similarity index 100%
rename from src/markdown/component.ts
rename to src/markdown/plugins/component.ts
diff --git a/src/markdown/containers.ts b/src/markdown/plugins/containers.ts
similarity index 100%
rename from src/markdown/containers.ts
rename to src/markdown/plugins/containers.ts
diff --git a/src/markdown/highlight.ts b/src/markdown/plugins/highlight.ts
similarity index 100%
rename from src/markdown/highlight.ts
rename to src/markdown/plugins/highlight.ts
diff --git a/src/markdown/highlightLines.ts b/src/markdown/plugins/highlightLines.ts
similarity index 100%
rename from src/markdown/highlightLines.ts
rename to src/markdown/plugins/highlightLines.ts
diff --git a/src/markdown/hoist.ts b/src/markdown/plugins/hoist.ts
similarity index 61%
rename from src/markdown/hoist.ts
rename to src/markdown/plugins/hoist.ts
index a0b39322..43007842 100644
--- a/src/markdown/hoist.ts
+++ b/src/markdown/plugins/hoist.ts
@@ -1,6 +1,9 @@
 import MarkdownIt from 'markdown-it'
+import { MarkdownParsedData } from '../markdown'
 
-export const hoistPlugin = (md: MarkdownIt & { __data: any }) => {
+// hoist <script> and <style> tags out of the returned html
+// so that they can be placed outside as SFC blocks.
+export const hoistPlugin = (md: MarkdownIt & { __data: MarkdownParsedData }) => {
   const RE = /^<(script|style)(?=(\s|>|$))/i
 
   md.renderer.rules.html_block = (tokens, idx) => {
diff --git a/src/markdown/lineNumbers.ts b/src/markdown/plugins/lineNumbers.ts
similarity index 100%
rename from src/markdown/lineNumbers.ts
rename to src/markdown/plugins/lineNumbers.ts
diff --git a/src/markdown/link.ts b/src/markdown/plugins/link.ts
similarity index 93%
rename from src/markdown/link.ts
rename to src/markdown/plugins/link.ts
index ebe973df..0aaf174d 100644
--- a/src/markdown/link.ts
+++ b/src/markdown/plugins/link.ts
@@ -3,11 +3,12 @@
 // 2. normalize internal links to end with `.html`
 
 import MarkdownIt from 'markdown-it'
+import { MarkdownParsedData } from '../markdown'
 
 const indexRE = /(^|.*\/)(index|readme).md(#?.*)$/i
 
 export const linkPlugin = (
-  md: MarkdownIt,
+  md: MarkdownIt & { __data: MarkdownParsedData },
   externalAttrs: Record<string, string>
 ) => {
   md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
@@ -30,7 +31,7 @@ export const linkPlugin = (
   }
 
   function normalizeHref(hrefAttr: [string, string]) {
-    const data = (md as any).__data
+    const data = md.__data
     let url = hrefAttr[1]
 
     // convert link to filename and export it for existence check
diff --git a/src/markdown/preWrapper.ts b/src/markdown/plugins/preWrapper.ts
similarity index 100%
rename from src/markdown/preWrapper.ts
rename to src/markdown/plugins/preWrapper.ts
diff --git a/src/markdown/slugify.ts b/src/markdown/plugins/slugify.ts
similarity index 100%
rename from src/markdown/slugify.ts
rename to src/markdown/plugins/slugify.ts
diff --git a/src/markdown/snippet.ts b/src/markdown/plugins/snippet.ts
similarity index 100%
rename from src/markdown/snippet.ts
rename to src/markdown/plugins/snippet.ts
diff --git a/src/resolver.ts b/src/server/resolver.ts
similarity index 83%
rename from src/resolver.ts
rename to src/server/resolver.ts
index 94968f48..7b1eaf99 100644
--- a/src/resolver.ts
+++ b/src/server/resolver.ts
@@ -2,9 +2,9 @@ import path from 'path'
 import { Resolver } from "vite"
 
 // built ts files are placed into /dist
-export const APP_PATH = path.join(__dirname, '../lib/app')
+export const APP_PATH = path.join(__dirname, '../../lib/app')
 // TODO detect user configured theme
-export const THEME_PATH = path.join(__dirname, '../lib/theme-default')
+export const THEME_PATH = path.join(__dirname, '../../lib/theme-default')
 
 export const VitePressResolver: Resolver = {
   publicToFile(publicPath) {
diff --git a/src/server.ts b/src/server/server.ts
similarity index 93%
rename from src/server.ts
rename to src/server/server.ts
index b9f0ce98..e39baa77 100644
--- a/src/server.ts
+++ b/src/server/server.ts
@@ -1,13 +1,13 @@
 import path from 'path'
 import { createServer as createViteServer, cachedRead, Plugin } from 'vite'
-import { createMarkdownFn } from './markdownToVue'
+import { createMarkdownToVueRenderFn } from '../markdown/markdownToVue'
 import { VitePressResolver, THEME_PATH, APP_PATH } from './resolver'
 
 const debug = require('debug')('vitepress:serve')
 const debugHmr = require('debug')('vitepress:hmr')
 
 const VitePressPlugin: Plugin = ({ app, root, watcher, resolver }) => {
-  const markdownToVue = createMarkdownFn(root)
+  const markdownToVue = createMarkdownToVueRenderFn(root)
 
   // watch theme files if it's outside of project root
   if (path.relative(root, THEME_PATH).startsWith('..')) {