自动生成文档

该项目是一个用于将Markdown文件批量转换为HTML并支持浏览器预览的工具。它监听文件变化,自动刷新浏览器展示内容,适用于Markdown文档的编写和编辑。遇到问题如样式加载失败或编译错误,可能需要更新浏览器或处理文件监听事件。项目依赖browser-sync、chalk、fs-extra和marked等库,提供了一种便捷的Markdown工作流程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

批量把Markdown文件转化成HTML,并且支持浏览器预览,实时更新同步修改

开发

npm start
  • 自动打开浏览器
  • 监听文件变化
  • 出现谷歌打开开发者工具之后操作页面卡死时,建议升级浏览器

生产

npm run build

介绍

目录结构
  • asserts:存放静态文件
    • style:本文件夹中的github-markdown.css文件是样式必需文件
  • build:打包执行的相关代码
  • dist:生成文档目录
  • src:Markdown文件目录
  • template:HTML模板文件目录

注:

  • 样式文件github-markdown.css下载地址

  • generate-github-markdown-css@4.0.0不要使用

    # 连接超时
    connect ETIMEDOUT 13.250.177.223:443
    
    # 样式编译报错
    Error: undefined:43:70: missing '{'
    

    出现上面两种错误,没有成功过

编译介绍
  • 拷贝assets目录以及其下所有文件到dist目录下面
  • 把src目录下面的所有Markdown文件转换成HTML
    • index.md编译成主页,自动生成列表(模板html为template/index.html)
    • 除了index.md,编译成列表详情页(模板html为template/detail.html)
  • 监听src和assets目录,当文件更新变化后,重新编译,刷新浏览器
    • node@10.13.0
    • 不推荐使用 fs.watchFile效率低,实际使用发现不好用
    • 推荐使用 fs.watch高效,但是listener的 eventType不一定准确(vscode修改文件,返回 change ;Typora修改文件返回的是 rename )
    • 一次修改会触发多次listener,本项目使用防抖来处理
依赖包介绍
  • browser-sync:建立本地服务,浏览器刷新
  • chalk:美化打印
  • fs-extra:封装node的fs,有方便的api
  • marked:Markdown文件转化成HTML
项目地址

结语

本项目提供了Markdown文件转化成HTML解决方案,如有问题欢迎交流!欢迎关注前端da公众号!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值