)
const exportList = Components.map(name => `${uppercamelize(name)}`)
const intallList = exportList.filter(
name => !~uninstallComponents.indexOf(uppercamelize(name))
)
const content = `import 'normalize.css'
${importList.join('n')}
const version = '${version}'
const components = [
${intallList.join(',n ')}
]const install = Vue => {
if (install.installed) return
components.map(component => Vue.component(component.name, component))
}
if (typeof window !== 'undefined' && window.Vue) {
install(window.Vue)
}
export {
install,
version,
${exportList.join(',n ')}
}
export default {
install,
version,
...components
}
`
fs.writeFileSync(path.join(__dirname, '../packages/index.js'), content)
log('packages/index.js 文件已更新依赖')
log('exit')
}
buildPackagesEntry()get-components.js
const fs = require('fs')
const path = require('path')
const excludes = [
'index.js',
'theme-chalk',
'mixins',
'utils',
'.DS_Store'
]module.exports = function () {
const dirs = fs.readdirSync(path.resolve(__dirname, '../packages'))
return dirs.filter(dirName => excludes.indexOf(dirName) === -1)
}
让 vue 解析 markdown
文档中心的 UI 是如何编码的这里不做阐述,小主可以自行参照 vue-cards 中的实现方式进行改造
需要安装以下的依赖,让 vue 解析 markdown
npm i markdown-it-container -D
npm i markdown-it-decorate -D
npm i markdown-it-task-checkbox -D
npm i vue-markdown-loader -D关于 vue.config.js 的配置在 vue-cards 该项目中也有了,不做阐述
这里将补充高亮 highlight.js 以及点击复制代码 clipboard 的实现方式
安装依赖
npm i clipboard highlight.js改造 App.vue ,以下只是列出部分代码,小主可以根据自己的需求进行添加
<script>
import hljs from 'highlight.js'
import Clipboard from 'clipboard'
const highlightCode = () => {
const preEl = document.querySelectorAll('pre')
preEl.forEach((el, index) => {
hljs.highlightBlock(el)
const lang = el.children[0].className.split(' ')[1].split('-')[1] const pre = el
const span = document.createElement('span')
span.setAttribute('class', 'code-copy')
span.setAttribute('data-clipboard-snippet', '')
span.innerHTML = `${lang.toUpperCase()} | COPY`
pre.appendChild(span)
})
}
export default {
name: 'App',
mounted () {
if ('onhashchange' in window) {
window.onhashchange = function (ev) {
let name = window.location.hash.substring(2)
router.push({ name })
}
}










