代码拉取完成,页面将自动刷新
同步操作将从 smallwei/avue-doc 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
基于Vuepress2的插件,它可以帮助你在编写组件库文档的时候增加示例代码和预览。
查看文档和示例:https://demo-block.seepine.com或克隆项目运行
请参考 Vuepress2 官方文档,点此查看
使用 yarn
安装 vuepress-plugin-demo-block-vue3
插件
yarn add vuepress-plugin-demo-block-vue3 -D
或者使用 npm
安装它:
npm i vuepress-plugin-demo-block-vue3 --save-dev
如果你的网络环境不佳,推荐使用 cnpm。
打开 .vuepress/config.js 文件,然后在合适的位置引用插件:
componentsDir
import { defineUserConfig } from 'vuepress'
import blockDemo from "vuepress-plugin-demo-block-vue3"
export default defineUserConfig({
...
plugins: [
blockDemo({
// 设置路径
path: __dirname,
})
],
...
})
::: warning 注意 componentsDir 必传,为动态注册组件的基础路径,目录结构可参考 element-plus :::
可在.vuepress/client.js
引入组件,需要注意的是,第三方库可能还需要依赖,例如ant-design-vue
还需要less
和less-loader
,请自行安装
import { defineClientConfig } from '@vuepress/client'
// import Antd from "ant-design-vue";
// import "ant-design-vue/dist/antd.css";
// import ElementPlus from "element-plus";
// import "element-plus/dist/index.css";
// import ArcoVue from '@arco-design/web-vue';
// import ArcoVueIcon from '@arco-design/web-vue/es/icon';
// import '@arco-design/web-vue/dist/arco.css';
export default defineClientConfig({
enhance({ app, router, siteData }) {
// app.use(Antd)
// app.use(ElementPlus)
// app.use(ArcoVue);
// app.use(ArcoVueIcon);
},
setup() {},
rootComponents: [],
})
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。