原文地址：https://www.mengze2.cn/post/5/

最近不是把博客的一些文章从和HTML转到Markdown了吗，因为之前换到了wordpress所以是HTML，但是这些文章再typecho无法被解析，于是就打算开发一个Markdown2HTML工具
下面使我的开发笔记，可能比较含糊

项目结构

一般情况下，我不会这么干，但是为了文章，还是需要定义的项目结构：

markdown2html/
│
├── index.php
├── convert.php
├── styles/
│   └── bootstrap.min.css
└── js/
    └── bootstrap.bundle.min.js

• index.php: 前端页面，包含输入框和按钮。
• convert.php: 后端逻辑处理，将HTML转换为Markdown或将Markdown转换为HTML。
• styles/: 存放CSS文件。
• js/: 存放JavaScript文件。

准备工作

下载Bootstrap

从Bootstrap官方网站下载最新版本的Bootstrap，并将bootstrap.min.css放入styles/文件夹，将bootstrap.bundle.min.js放入js/文件夹。也就是所谓的按需导入

编写前端页面 (index.php)

编写前端页面，包含一个文本输入框和两个按钮，分别用于将HTML转换为Markdown和将Markdown转换为HTML。这里不要求好看，而且需要快速开发响应式页面，所以选择bootstrap

    
    
    
    


    

        
转换工具
        

            

                Input Text
                
            
            

                HTML转Markdown
                Markdown转HTML
            
            

                Output Text
                
            
        
    

    
    

编写后端逻辑 (convert.php)

接下来，编写后端逻辑，将HTML转换为Markdown或将Markdown转换为HTML。

convert($inputText);
    } elseif ($action === 'markdown2html') {
        $outputText = Markdown::defaultTransform($inputText);
    }

    echo $outputText;
}
?>

添加依赖

需要安装两个PHP库来实现转换功能：

Composer是一个包管理器，类似node的npm，和我发现PHP和Vue有异曲同工之妙

• league/html-to-markdown: 将HTML转换为Markdown。
• michelf/php-markdown: 将Markdown转换为HTML。

在项目根目录下创建一个composer.json文件，内容如下：

{
    "require": {
        "league/html-to-markdown": "^5.0",
        "michelf/php-markdown": "^1.9"
    }
}

然后运行composer install来安装这些依赖。

composer install

最终效果

启动本地服务器（例如使用php -S localhost:8000），访问http://localhost:8000/，就可以看到转换工具的界面了。