Tinker 发表于 2022-4-28 11:17:56

Markdown 编辑器帖子样本演示

# Hello World 文章

这是一个测试文章。~~什么东西都有~~ 是**不可能**的。*按时更新想想就好了*。

## 弄了一个表格

| 实际速度 |加速度|
|----------|----------|
| 0      |          |
| 21.48438 | 21.48438 |
| 36.46875 | 14.98438 |
| 51.45313 | 14.98438 |
| 66.4375| 14.98438 |
| 81.42187 | 14.98437 |
| 96.29073 | 14.86886 |
| 109.9515 | 13.66075 |
| 122.5023 | 12.55082 |

### 主要特性

- 支持“标准”Markdown / CommonMark和Github风格的语法，也可变身为代码编辑器；
- 支持实时预览、图片（跨域）上传、预格式文本/代码/表格插入、代码折叠、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能；
- 支持ToC（Table of Contents）、Emoji表情、Task lists、@链接等Markdown扩展语法；
- 支持TeX科学公式（基于KaTeX）、流程图 Flowchart 和 时序图 Sequence Diagram;
- 支持识别和解析HTML标签，并且支持自定义过滤标签解析，具有可靠的安全性和几乎无限的扩展性；
- 支持 AMD / CMD 模块化加载（支持 Require.js & Sea.js），并且支持自定义扩展插件；
- 兼容主流的浏览器（IE8+）和Zepto.js，且支持iPad等平板设备；
- 支持自定义主题样式；

支持 jpg、png、gif、svg 等图片格式，**其中 svg 文件仅可在微信公众平台中使用**，svg 文件示例如下：

![](https://bbs.upkk.com/static/image/xnet_custom/i-am-svg.svg)

# 测试文本

**目录 (Table of Contents)**





# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
# Heading 1 link (https://github.com/pandao/editor.md "Heading link")
## Heading 2 link (https://github.com/pandao/editor.md "Heading link")
### Heading 3 link (https://github.com/pandao/editor.md "Heading link")
#### Heading 4 link (https://github.com/pandao/editor.md "Heading link") Heading link (https://github.com/pandao/editor.md "Heading link")
##### Heading 5 link (https://github.com/pandao/editor.md "Heading link")
###### Heading 6 link (https://github.com/pandao/editor.md "Heading link")

#### 标题（用底线的形式）Heading (underline)

This is an H1
=============

This is an H2
-------------

### 字符效果和横线等
               
----

~~删除线~~ <s>删除线（开启识别HTML标签时）</s>
*斜体字*      _斜体字_
**粗体**__粗体__
***粗斜体*** ___粗斜体___

上标：X<sub>2</sub>，下标：O<sup>2</sup>

**缩写(同HTML的abbr标签)**

> 即更长的单词或短语的缩写形式，前提是开启识别HTML标签时，已默认开启

The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>.

### 引用 Blockquotes

> 引用文本 Blockquotes

引用的行内混合 Blockquotes
                  
> 引用：如果想要插入空白换行`即<br />标签`，在插入处先键入两个以上的空格然后回车即可，[普通链接](http://localhost/)。

### 锚点与链接 Links

[普通链接](http://localhost/)

[普通链接带标题](http://localhost/ "普通链接带标题")

直接链接：<https://github.com>

[锚点链接]

: http://www.this-anchor-link.com/

GFM a-tail link @pandao

> @pandao

### 多语言代码高亮 Codes

#### 行内代码 Inline code

执行命令：`npm install marked`

#### 缩进风格

即缩进四个空格，也做为实现类似`<pre>`预格式化文本(Preformatted Text)的功能。

    <?php
      echo "Hello world!";
    ?>
   
预格式化文本：

    | First Header| Second Header |
    | ------------- | ------------- |
    | Content Cell| Content Cell|
    | Content Cell| Content Cell|

#### JS代码　

```javascript
function test(){
    console.log("Hello world!");
}

(function(){
    var box = function(){
      return box.fn.init();
    };

    box.prototype = box.fn = {
      init : function(){
            console.log('box.init()');

            return this;
      },

      add : function(str){
            alert("add", str);

            return this;
      },

      remove : function(str){
            alert("remove", str);

            return this;
      }
    };
   
    box.fn.init.prototype = box.fn;
   
    window.box =box;
})();

var testBox = box();
testBox.add("jQuery").remove("jQuery");
```

#### HTML代码 HTML codes

```html
<!DOCTYPE html>
<html>
    <head>
      <mate charest="utf-8" />
      <title>Hello world!</title>
    </head>
    <body>
      <h1>Hello world!</h1>
    </body>
</html>
```

### 图片 Images


> 图为：厦门白城沙滩

图片加链接 (Image + Link)：

![](./data/attachment/forum/202204/28/170359ml7r7giilnwwmggg.jpg)

![](./data/attachment/forum/202204/28/170424tlwzqejdtnwnsa99.jpg)

> 图为：李健首张专辑《似水流年》封面
               
----

### 列表 Lists

#### 无序列表（减号）Unordered Lists (-)
               
- 列表一
- 列表二
- 列表三
   
#### 无序列表（星号）Unordered Lists (*)

* 列表一
* 列表二
* 列表三

#### 无序列表（加号和嵌套）Unordered Lists (+)
               
+ 列表一
+ 列表二
    + 列表二-1
    + 列表二-2
    + 列表二-3
+ 列表三
    * 列表一
    * 列表二
    * 列表三

#### 有序列表 Ordered Lists (-)
               
1. 第一行
2. 第二行
3. 第三行

#### GFM task list

- GFM task list 1
- GFM task list 2
- [ ] GFM task list 3
    - [ ] GFM task list 3-1
    - [ ] GFM task list 3-2
    - [ ] GFM task list 3-3
- [ ] GFM task list 4
    - [ ] GFM task list 4-1
    - [ ] GFM task list 4-2
               
----
                  
### 绘制表格 Tables

| 项目      | 价格   |数量|
| --------   | -----:| :----:|
| 计算机      | $1600   |   5   |
| 手机      |   $12   |   12   |
| 管线      |    $1    |234|
                  
First Header| Second Header
------------- | -------------
Content Cell| Content Cell
Content Cell| Content Cell

| First Header| Second Header |
| ------------- | ------------- |
| Content Cell| Content Cell|
| Content Cell| Content Cell|

| Function name | Description                  |
| ------------- | ------------------------------ |
| `help()`      | Display the help window.       |
| `destroy()`   | **Destroy your computer!**   |

| Left-Aligned| Center Aligned| Right Aligned |
| :------------ |:---------------:| -----:|
| col 3 is      | some wordy text | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

| Item      | Value |
| --------- | -----:|
| Computer| $1600 |
| Phone   |   $12 |
| Pipe      |    $1 |
               
----

#### 特殊符号 HTML Entities Codes

X² Y³ ¾ ¼×÷   »

18ºC"'

### Emoji表情
:tw-1f435: :tw-1f436: :tw-1f437::tw-1f4af: :tw-1f51f: :tw-1f51e: :tw-1f51d: :tw-1f51c: :tw-1f51b: :tw-1f51a: :tw-1f517: :tw-1f515: :tw-1f514: :tw-1f528: :tw-1f527: :tw-1f513: :tw-1f512: :tw-1f525: :tw-1f524:

> Blockquotes :star:

#### GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x:

#### 反斜杠 Escape

\*literal asterisks\*
            
### 科学公式 TeX(KaTeX)
                  
$$E=mc^2$$

行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。

$$\(\sqrt{3x-1}+(1+x)^2\)$$
                  
$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$

多行公式：

```math
\displaystyle
\left( \sum\_{k=1}^n a\_k b\_k \right)^2
\leq
\left( \sum\_{k=1}^n a\_k^2 \right)
\left( \sum\_{k=1}^n b\_k^2 \right)
```

```katex
\displaystyle
    \frac{1}{
      \Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{
      \frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {
      1+\frac{e^{-6\pi}}
      {1+\frac{e^{-8\pi}}
         {1+\cdots} }
      }
    }
```

```latex
f(x) = \int_{-\infty}^\infty
    \hat f(\xi)\,e^{2 \pi i \xi x}
    \,d\xi
```
               
### 绘制流程图 Flowchart

```flow
st=>start: 用户登陆
op=>operation: 登陆操作
cond=>condition: 登陆成功 Yes or No?
e=>end: 进入后台

st->op->cond
cond(yes)->e
cond(no)->op
```
                  
### 绘制序列图 Sequence Diagram
                  
```seq
Andrew->China: Says Hello
Note right of China: China thinks\nabout it
China-->Andrew: How are you?
Andrew->>China: I am good thanks!
```

### End


    # Hello World 文章
   
    这是一个测试文章。~~什么东西都有~~ 是**不可能**的。*按时更新想想就好了*。
   
    ## 弄了一个表格
   
    | 实际速度 |加速度|
    |----------|----------|
    | 0      |          |
    | 21.48438 | 21.48438 |
    | 36.46875 | 14.98438 |
    | 51.45313 | 14.98438 |
    | 66.4375| 14.98438 |
    | 81.42187 | 14.98437 |
    | 96.29073 | 14.86886 |
    | 109.9515 | 13.66075 |
    | 122.5023 | 12.55082 |
   
    ### 主要特性
   
    - 支持“标准”Markdown / CommonMark和Github风格的语法，也可变身为代码编辑器；
    - 支持实时预览、图片（跨域）上传、预格式文本/代码/表格插入、代码折叠、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能；
    - 支持ToC（Table of Contents）、Emoji表情、Task lists、@链接等Markdown扩展语法；
    - 支持TeX科学公式（基于KaTeX）、流程图 Flowchart 和 时序图 Sequence Diagram;
    - 支持识别和解析HTML标签，并且支持自定义过滤标签解析，具有可靠的安全性和几乎无限的扩展性；
    - 支持 AMD / CMD 模块化加载（支持 Require.js & Sea.js），并且支持自定义扩展插件；
    - 兼容主流的浏览器（IE8+）和Zepto.js，且支持iPad等平板设备；
    - 支持自定义主题样式；
   
    # 测试文本
   
    **目录 (Table of Contents)**
   
   
   
   
   
    # Heading 1
    ## Heading 2
    ### Heading 3
    #### Heading 4
    ##### Heading 5
    ###### Heading 6
    # Heading 1 link (https://github.com/pandao/editor.md "Heading link")
    ## Heading 2 link (https://github.com/pandao/editor.md "Heading link")
    ### Heading 3 link (https://github.com/pandao/editor.md "Heading link")
    #### Heading 4 link (https://github.com/pandao/editor.md "Heading link") Heading link (https://github.com/pandao/editor.md "Heading link")
    ##### Heading 5 link (https://github.com/pandao/editor.md "Heading link")
    ###### Heading 6 link (https://github.com/pandao/editor.md "Heading link")
   
    #### 标题（用底线的形式）Heading (underline)
   
    This is an H1
    =============
   
    This is an H2
    -------------
   
    ### 字符效果和横线等
                  
    ----
   
    ~~删除线~~ <s>删除线（开启识别HTML标签时）</s>
    *斜体字*      _斜体字_
    **粗体**__粗体__
    ***粗斜体*** ___粗斜体___
   
    上标：X<sub>2</sub>，下标：O<sup>2</sup>
   
    **缩写(同HTML的abbr标签)**
   
    > 即更长的单词或短语的缩写形式，前提是开启识别HTML标签时，已默认开启
   
    The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>.
   
    ### 引用 Blockquotes
   
    > 引用文本 Blockquotes
   
    引用的行内混合 Blockquotes
                        
    > 引用：如果想要插入空白换行`即<br />标签`，在插入处先键入两个以上的空格然后回车即可，[普通链接](http://localhost/)。
   
    ### 锚点与链接 Links
   
    [普通链接](http://localhost/)
   
    [普通链接带标题](http://localhost/ "普通链接带标题")
   
    直接链接：<https://github.com>
   
    [锚点链接]
   
    : http://www.this-anchor-link.com/
   
    GFM a-tail link @pandao
   
    > @pandao
   
    ### 多语言代码高亮 Codes
   
    #### 行内代码 Inline code
   
    执行命令：`npm install marked`
   
    #### 缩进风格
   
    即缩进四个空格，也做为实现类似`<pre>`预格式化文本(Preformatted Text)的功能。
   
      <?php
            echo "Hello world!";
      ?>
      
    预格式化文本：
   
      | First Header| Second Header |
      | ------------- | ------------- |
      | Content Cell| Content Cell|
      | Content Cell| Content Cell|
   
    #### JS代码　
   
    ```javascript

    #### HTML代码 HTML codes
   
    ```html
    <!DOCTYPE html>
   
    </html>
    ```
   
    ### 图片 Images
   
    Image:
   
    ![](https://pandao.github.io/editor.md/examples/images/4.jpg)
   
    > Follow your heart.
   
    ![](https://pandao.github.io/editor.md/examples/images/8.jpg)
   
    > 图为：厦门白城沙滩
   
    图片加链接 (Image + Link)：
   
    [![](https://pandao.github.io/editor.md/examples/images/7.jpg)](https://pandao.github.io/editor.md/examples/images/7.jpg "李健首张专辑《似水流年》封面")
   
    > 图为：李健首张专辑《似水流年》封面
                  
    ----
   
    ### 列表 Lists
   
    #### 无序列表（减号）Unordered Lists (-)
                  
    - 列表一
    - 列表二
    - 列表三
         
    #### 无序列表（星号）Unordered Lists (*)
   
    * 列表一
    * 列表二
    * 列表三
   
    #### 无序列表（加号和嵌套）Unordered Lists (+)
                  
    + 列表一
    + 列表二
      + 列表二-1
      + 列表二-2
      + 列表二-3
    + 列表三
      * 列表一
      * 列表二
      * 列表三
   
    #### 有序列表 Ordered Lists (-)
                  
    1. 第一行
    2. 第二行
    3. 第三行
   
    #### GFM task list
   
    - GFM task list 1
    - GFM task list 2
    - [ ] GFM task list 3
      - [ ] GFM task list 3-1
      - [ ] GFM task list 3-2
      - [ ] GFM task list 3-3
    - [ ] GFM task list 4
      - [ ] GFM task list 4-1
      - [ ] GFM task list 4-2
                  
    ----
                        
    ### 绘制表格 Tables
   
    | 项目      | 价格   |数量|
    | --------   | -----:| :----:|
    | 计算机      | $1600   |   5   |
    | 手机      |   $12   |   12   |
    | 管线      |    $1    |234|
                        
    First Header| Second Header
    ------------- | -------------
    Content Cell| Content Cell
    Content Cell| Content Cell
   
    | First Header| Second Header |
    | ------------- | ------------- |
    | Content Cell| Content Cell|
    | Content Cell| Content Cell|
   
    | Function name | Description                  |
    | ------------- | ------------------------------ |
    | `help()`      | Display the help window.       |
    | `destroy()`   | **Destroy your computer!**   |
   
    | Left-Aligned| Center Aligned| Right Aligned |
    | :------------ |:---------------:| -----:|
    | col 3 is      | some wordy text | $1600 |
    | col 2 is      | centered      |   $12 |
    | zebra stripes | are neat      |    $1 |
   
    | Item      | Value |
    | --------- | -----:|
    | Computer| $1600 |
    | Phone   |   $12 |
    | Pipe      |    $1 |
                  
    ----
   
    #### 特殊符号 HTML Entities Codes
   
    X² Y³ ¾ ¼×÷   »
   
    18ºC"'
   
    ### Emoji表情
    :tw-1f435: :tw-1f436: :tw-1f437::tw-1f4af: :tw-1f51f: :tw-1f51e: :tw-1f51d: :tw-1f51c: :tw-1f51b: :tw-1f51a: :tw-1f517: :tw-1f515: :tw-1f514: :tw-1f528: :tw-1f527: :tw-1f513: :tw-1f512: :tw-1f525: :tw-1f524:
   
    > Blockquotes :star:
   
    #### GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x:
   
    #### 反斜杠 Escape
   
    \*literal asterisks\*
               
    ### 科学公式 TeX(KaTeX)
                        
    $$E=mc^2$$
   
    行内的公式$$E=mc^2$$行内的公式，行内的$$E=mc^2$$公式。
   
    $$\(\sqrt{3x-1}+(1+x)^2\)$$
                        
    $$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$
   
    多行公式：
   
    ```math
    \displaystyle
    \left( \sum\_{k=1}^n a\_k b\_k \right)^2
    \leq
    \left( \sum\_{k=1}^n a\_k^2 \right)
    \left( \sum\_{k=1}^n b\_k^2 \right)
    ```
   
    ```katex
    \displaystyle
      \frac{1}{
            \Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{
            \frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {
            1+\frac{e^{-6\pi}}
            {1+\frac{e^{-8\pi}}
             {1+\cdots} }
            }
      }
    ```
   
    ```latex
    f(x) = \int_{-\infty}^\infty
      \hat f(\xi)\,e^{2 \pi i \xi x}
      \,d\xi
    ```
                  
    ### 绘制流程图 Flowchart
   
    ```flow
    st=>start: 用户登陆
    op=>operation: 登陆操作
    cond=>condition: 登陆成功 Yes or No?
    e=>end: 进入后台
   
    st->op->cond
    cond(yes)->e
    cond(no)->op
    ```
                        
    ### 绘制序列图 Sequence Diagram
                        
    ```seq
    Andrew->China: Says Hello
    Note right of China: China thinks\nabout it
    China-->Andrew: How are you?
    Andrew->>China: I am good thanks!
    ```
   
    ### End




            
            
            
            
            
            
            

Tinker 发表于 2022-4-29 12:05:38


   
    一个不纯粹的PHPer，一个不自由的 gopher 。
   
   
   

# 样本案例2

[!(https://travis-ci.org/lifei6671/mindoc.svg?branch=master)](https://travis-ci.org/lifei6671/mindoc)

MinDoc 是一款针对IT团队开发的简单好用的文档管理系统。

MinDoc 的前身是 SmartWiki 文档系统。SmartWiki 是基于 PHP 框架 laravel 开发的一款文档管理系统。因 PHP 的部署对普通用户来说太复杂，所以改用 Golang 开发。可以方便用户部署和实用。

开发缘起是公司IT部门需要一款简单实用的项目接口文档管理和分享的系统。其功能和界面源于 kancloud 。

可以用来储存日常接口文档，数据库字典，手册说明等文档。内置项目管理，用户管理，权限管理等功能，能够满足大部分中小团队的文档管理需求。

演示站点： (http://doc.iminho.me)

# 安装与使用

**如果你的服务器上没有安装golang程序请手动设置一个环境变量如下：键名为 ZONEINFO，值为MinDoc跟目录下的/lib/time/zoneinfo.zip 。**

**Windows 教程:** (docs/README_WIN.md)

**Linux教程:** &nbsp;(docs/README_LINUX.md)

**PDF 导出配置教程** &nbsp;(docs/WKHTMLTOPDF.md)

对于没有Golang使用经验的用户，可以从 (https://github.com/mindoc-org/mindoc/releases) 这里下载编译完的程序。

如果有Golang开发经验，建议通过编译安装。

```bash
git clone https://github.com/mindoc-org/mindoc.git

go get -d ./...

go build -ldflags "-w"

```

MinDoc 使用MySQL储存数据，且编码必须是`utf8mb4_general_ci`。请在安装前，把数据库配置填充到项目目录下的 conf/app.conf 中。

如果conf目录下不存在 app.conf 请重命名 app.conf.example 为 app.conf。

如果 MinDoc 根目录下存在 install.lock 文件表示已经初始化过数据库，想要重新初始化数据库，只需要删除该文件重新启动程序即可。

**默认程序会自动创建表，同时初始化一个超级管理员用户：admin 密码：123456 。请登录后重新设置密码。**

## Linux 下后台运行

在 Linux 如果想让程序后台运行可以执行如下命令：

```bash
#使程序后台运行
nohup ./godoc &amp;
```

该命令会使程序后台执行，但是服务器重启后不会自动启动服务。

使用 supervisor 做服务，可以使服务器重启后自动重启 MinDoc。

## Windows 下后台运行

Windows 下后台运行需要借助 CMD 命令行命令：

```bash
#在MinDoc根目录下新建一个slave.vbs文件：

Set ws = CreateObject("Wscript.Shell")
ws.run "cmd /c start.bat",vbhide

#再建一个start.bat文件：
@echo off

godoc_windows_amd64.exe

```

启动时双击slave.vbs即可，等待程序初始化完数据库会在该目录下创建一个install.lock文件，标识已安装成功。

如果是自己编译，可以用以下命令即可编译出不依赖cmd命令的后台运行的程序：

```bash
go build -ldflags "-H=windowsgui"
```
通过该命令编译的Golang程序在Windows上默认后台运行。

请将将 MinDoc 加入开机启动列表，使程序开机启动。

## 密码找回功能

密码找回功能依赖邮件服务，因此，需要配置邮件服务才能使用该功能,该配置位于 `conf/app.conf` 中：

```bash

#邮件配置
#是否启用邮件
enable_mail=true
#smtp服务器的账号
[email protected]
#smtp服务器的地址
smtp_host=smtp.ym.163.com
#密码
smtp_password=1q2w3e__ABC
#端口号
smtp_port=25
#邮件发送人的地址
[email protected]
#邮件有效期30分钟
mail_expired=30
```


# 使用Docker部署

如果是Docker用户，可参考项目内置的Dockerfile文件编译镜像。

在启动镜像时需要提供如下的环境变量：

```ini
MYSQL_PORT_3306_TCP_ADDR    MySQL地址
MYSQL_PORT_3306_TCP_PORT    MySQL端口号
MYSQL_INSTANCE_NAME         MySQL数据库名称
MYSQL_USERNAME            MySQL账号
MYSQL_PASSWORD            MySQL密码
HTTP_PORT                   程序监听的端口号
```

举个栗子

```bash
docker run -p 8181:8181 -e MYSQL_PORT_3306_TCP_ADDR=127.0.0.1 -e MYSQL_PORT_3306_TCP_PORT=3306 -e MYSQL_INSTANCE_NAME=mindoc_db -e MYSQL_USERNAME=root -e MYSQL_PASSWORD=123456 -e httpport=8181 -d daocloud.io/lifei6671/mindoc:latest
```

# 项目截图

**创建项目**

![创建项目](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204438.png)

**项目列表**

![项目列表](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203542.png)

**项目概述**

![项目概述](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203619.png)

**项目成员**

![项目成员](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203637.png)

**项目设置**

![项目设置](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203656.png)

**基于Editor.md开发的Markdown编辑器**

![基于Editor.md开发的Markdown编辑器](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203854.png)

**基于wangEditor开发的富文本编辑器**

![基于wangEditor开发的富文本编辑器](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204651.png)

**项目预览**

![项目预览](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204609.png)

**超级管理员后台**

![超级管理员后台](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204710.png)


# 使用的技术

- beego 1.8.1
- mysql 5.6
- editor.md
- bootstrap 3.2
- jquery 库
- layer 弹出层框架
- webuploader 文件上传框架
- Nprogress 库
- jstree 树状结构库
- font awesome 字体库
- cropper 图片剪裁库
- layer 弹出层框架
- highlight 代码高亮库
- to-markdown HTML转Markdown库
- wangEditor 富文本编辑器


# 主要功能

- 项目管理，可以对项目进行编辑更改，成员添加等。
- 文档管理，添加和删除文档等。
- 评论管理，可以管理文档评论和自己发布的评论。
- 用户管理，添加和禁用用户，个人资料更改等。
- 用户权限管理 ， 实现用户角色的变更。
- 项目加密，可以设置项目公开状态，私有项目需要通过Token访问。
- 站点配置，可开启匿名访问、验证码等。

# 参与开发

我们欢迎您在 MinDoc 项目的 GitHub 上报告 issue 或者 pull request。

如果您还不熟悉GitHub的Fork and Pull开发模式，您可以阅读GitHub的文档（https://help.github.com/articles/using-pull-requests） 获得更多的信息。

# 关于作者

一个不纯粹的PHPer，一个不自由的 gopher 。



    # 样本案例2
   
    [!(https://travis-ci.org/lifei6671/mindoc.svg?branch=master)](https://travis-ci.org/lifei6671/mindoc)
   
    MinDoc 是一款针对IT团队开发的简单好用的文档管理系统。
   
    MinDoc 的前身是 SmartWiki 文档系统。SmartWiki 是基于 PHP 框架 laravel 开发的一款文档管理系统。因 PHP 的部署对普通用户来说太复杂，所以改用 Golang 开发。可以方便用户部署和实用。
   
    开发缘起是公司IT部门需要一款简单实用的项目接口文档管理和分享的系统。其功能和界面源于 kancloud 。
   
    可以用来储存日常接口文档，数据库字典，手册说明等文档。内置项目管理，用户管理，权限管理等功能，能够满足大部分中小团队的文档管理需求。
   
    演示站点： (http://doc.iminho.me)
   
    # 安装与使用
   
    **如果你的服务器上没有安装golang程序请手动设置一个环境变量如下：键名为 ZONEINFO，值为MinDoc跟目录下的/lib/time/zoneinfo.zip 。**
   
    **Windows 教程:** (docs/README_WIN.md)
   
    **Linux教程:** &nbsp;(docs/README_LINUX.md)
   
    **PDF 导出配置教程** &nbsp;(docs/WKHTMLTOPDF.md)
   
    对于没有Golang使用经验的用户，可以从 (https://github.com/mindoc-org/mindoc/releases) 这里下载编译完的程序。
   
    如果有Golang开发经验，建议通过编译安装。
   
    ```bash
    git clone https://github.com/mindoc-org/mindoc.git
   
    go get -d ./...
   
    go build -ldflags "-w"
   
    ```
   
    MinDoc 使用MySQL储存数据，且编码必须是`utf8mb4_general_ci`。请在安装前，把数据库配置填充到项目目录下的 conf/app.conf 中。
   
    如果conf目录下不存在 app.conf 请重命名 app.conf.example 为 app.conf。
   
    如果 MinDoc 根目录下存在 install.lock 文件表示已经初始化过数据库，想要重新初始化数据库，只需要删除该文件重新启动程序即可。
   
    **默认程序会自动创建表，同时初始化一个超级管理员用户：admin 密码：123456 。请登录后重新设置密码。**
   
    ## Linux 下后台运行
   
    在 Linux 如果想让程序后台运行可以执行如下命令：
   
    ```bash
    #使程序后台运行
    nohup ./godoc &amp;
    ```
   
    该命令会使程序后台执行，但是服务器重启后不会自动启动服务。
   
    使用 supervisor 做服务，可以使服务器重启后自动重启 MinDoc。
   
    ## Windows 下后台运行
   
    Windows 下后台运行需要借助 CMD 命令行命令：
   
    ```bash
    #在MinDoc根目录下新建一个slave.vbs文件：
   
    Set ws = CreateObject("Wscript.Shell")
    ws.run "cmd /c start.bat",vbhide
   
    #再建一个start.bat文件：
    @echo off
   
    godoc_windows_amd64.exe
   
    ```
   
    启动时双击slave.vbs即可，等待程序初始化完数据库会在该目录下创建一个install.lock文件，标识已安装成功。
   
    如果是自己编译，可以用以下命令即可编译出不依赖cmd命令的后台运行的程序：
   
    ```bash
    go build -ldflags "-H=windowsgui"
    ```
    通过该命令编译的Golang程序在Windows上默认后台运行。
   
    请将将 MinDoc 加入开机启动列表，使程序开机启动。
   
    ## 密码找回功能
   
    密码找回功能依赖邮件服务，因此，需要配置邮件服务才能使用该功能,该配置位于 `conf/app.conf` 中：
   
    ```bash
   
    #邮件配置
    #是否启用邮件
    enable_mail=true
    #smtp服务器的账号
    [email protected]
    #smtp服务器的地址
    smtp_host=smtp.ym.163.com
    #密码
    smtp_password=1q2w3e__ABC
    #端口号
    smtp_port=25
    #邮件发送人的地址
    [email protected]
    #邮件有效期30分钟
    mail_expired=30
    ```
   
   
    # 使用Docker部署
   
    如果是Docker用户，可参考项目内置的Dockerfile文件编译镜像。
   
    在启动镜像时需要提供如下的环境变量：
   
    ```ini
    MYSQL_PORT_3306_TCP_ADDR    MySQL地址
    MYSQL_PORT_3306_TCP_PORT    MySQL端口号
    MYSQL_INSTANCE_NAME         MySQL数据库名称
    MYSQL_USERNAME            MySQL账号
    MYSQL_PASSWORD            MySQL密码
    HTTP_PORT                   程序监听的端口号
    ```
   
    举个栗子
   
    ```bash
    docker run -p 8181:8181 -e MYSQL_PORT_3306_TCP_ADDR=127.0.0.1 -e MYSQL_PORT_3306_TCP_PORT=3306 -e MYSQL_INSTANCE_NAME=mindoc_db -e MYSQL_USERNAME=root -e MYSQL_PASSWORD=123456 -e httpport=8181 -d daocloud.io/lifei6671/mindoc:latest
    ```
   
    # 项目截图
   
    **创建项目**
   
    ![创建项目](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204438.png)
   
    **项目列表**
   
    ![项目列表](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203542.png)
   
    **项目概述**
   
    ![项目概述](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203619.png)
   
    **项目成员**
   
    ![项目成员](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203637.png)
   
    **项目设置**
   
    ![项目设置](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203656.png)
   
    **基于Editor.md开发的Markdown编辑器**
   
    ![基于Editor.md开发的Markdown编辑器](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501203854.png)
   
    **基于wangEditor开发的富文本编辑器**
   
    ![基于wangEditor开发的富文本编辑器](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204651.png)
   
    **项目预览**
   
    ![项目预览](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204609.png)
   
    **超级管理员后台**
   
    ![超级管理员后台](https://raw.githubusercontent.com/lifei6671/mindoc/master/uploads/20170501204710.png)
   
   
    # 使用的技术
   
    - beego 1.8.1
    - mysql 5.6
    - editor.md
    - bootstrap 3.2
    - jquery 库
    - layer 弹出层框架
    - webuploader 文件上传框架
    - Nprogress 库
    - jstree 树状结构库
    - font awesome 字体库
    - cropper 图片剪裁库
    - layer 弹出层框架
    - highlight 代码高亮库
    - to-markdown HTML转Markdown库
    - wangEditor 富文本编辑器
   
   
    # 主要功能
   
    - 项目管理，可以对项目进行编辑更改，成员添加等。
    - 文档管理，添加和删除文档等。
    - 评论管理，可以管理文档评论和自己发布的评论。
    - 用户管理，添加和禁用用户，个人资料更改等。
    - 用户权限管理 ， 实现用户角色的变更。
    - 项目加密，可以设置项目公开状态，私有项目需要通过Token访问。
    - 站点配置，可开启匿名访问、验证码等。
   
    # 参与开发
   
    我们欢迎您在 MinDoc 项目的 GitHub 上报告 issue 或者 pull request。
   
    如果您还不熟悉GitHub的Fork and Pull开发模式，您可以阅读GitHub的文档（https://help.github.com/articles/using-pull-requests） 获得更多的信息。
   
    # 关于作者
            

Tinker 发表于 2022-4-29 19:32:12

>微信公众号排版工具。问题或建议，请公众号留言。**[程序员翻身](#jump_8)**

建议使用 **Chrome** 浏览器，体验最佳效果。

使用微信公众号编辑器有一个十分头疼的问题：粘贴出来的代码，格式错乱，空间小还带行号，而且特别丑。Markdown.com.cn编辑器能够解决这个问题。

Markdown是一种轻量级的「标记语言」。

请阅读下方文本熟悉工具使用方法，本文可直接拷贝到微信中预览。

## 1 Markdown.com.cn 简介

- 支持自定义样式的 Markdown 编辑器
- 支持微信公众号、知乎和稀土掘金
- 点击右上方对应图标，一键复制到各平台

## 2 Markdown语法教程

### 2.1 标题

不同数量的`#`可以完成不同的标题，如下：

# 一级标题

## 二级标题

### 三级标题

### 2.2 字体

粗体、斜体、粗体和斜体，删除线，需要在文字前后加不同的标记符号。如下：

**这个是粗体**

*这个是斜体*

***这个是粗体加斜体***

~这里想用删除线~~

注：如果想给字体换颜色、字体或者居中显示，需要使用内嵌HTML来实现。

### 2.3 无序列表

无序列表的使用，在符号`-`后加空格使用。如下：

- 无序列表 1
- 无序列表 2
- 无序列表 3

如果要控制列表的层级，则需要在符号`-`前使用空格。如下：

- 无序列表 1
- 无序列表 2
- 无序列表 2.1
- 无序列表 2.2

**由于微信原因，最多支持到二级列表**。

### 2.4 有序列表

有序列表的使用，在数字及符号`.`后加空格后输入内容，如下：

1. 有序列表 1
2. 有序列表 2
3. 有序列表 3

### 2.5 引用

引用的格式是在符号`>`后面书写文字。如下：

> 读一本好书，就是在和高尚的人谈话。 ——歌德

> 雇用制度对工人不利，但工人根本无力摆脱这个制度。 ——阮一峰

### 2.7 链接

微信公众号仅支持公众号文章链接，即域名为`https://mp.weixin.qq.com/`的合法链接。使用方法如下所示：

对于该论述，欢迎读者查阅之前发过的文章，[你是《未来世界的幸存者》么？](https://mp.weixin.qq.com/s/s5IhxV2ooX3JN_X416nidA)
<a id="jump_8"></a>
### 2.8 图片

插入图片，格式如下：

![这里写图片描述](https://www.nginx.cn/wp-content/uploads/2020/03/qrcode_for_gh_82cf87d482f0_258.jpg)

支持 jpg、png、gif、svg 等图片格式，**其中 svg 文件仅可在微信公众平台中使用**，svg 文件示例如下：

![](https://markdown.com.cn/images/i-am-svg.svg)

支持图片**拖拽和截图粘贴**到编辑器中。

注：支持图片 ***拖拽和截图粘贴*** 到编辑器中，仅支持 https 的图片，图片粘贴到微信时会自动上传微信服务器。

### 2.9 分割线

可以在一行中用三个以上的减号来建立一个分隔线，同时需要在分隔线的上面空一行。如下：

---

### 2.10 表格

可以使用冒号来定义表格的对齐方式，如下：

| 姓名   | 年龄 |   工作 |
| :----- | :--: | -------: |
| 小可爱 |18| 吃可爱多 |
| 小小勇敢 |20| 爬棵勇敢树 |
| 小小小机智 |22| 看一本机智书 |



## 3. 特殊语法

### 3.1 脚注

> 支持平台：微信公众号、知乎。

脚注与链接的区别如下所示：

```markdown
链接：[文字](链接)
脚注：[文字](脚注解释 "脚注名字")
```

有人认为在[大前端时代](https://en.wikipedia.org/wiki/Front-end_web_development "Front-end web development")的背景下，移动端开发（Android、IOS）将逐步退出历史舞台。

[全栈工程师](是指掌握多种技能，并能利用多种技能独立完成产品的人。 "什么是全栈工程师")在业务开发流程中起到了至关重要的作用。

脚注内容请拉到最下面观看。

### 3.2 代码块

> 支持平台：微信代码主题仅支持微信公众号！其他主题无限制。

如果在一个行内需要引用代码，只要用反引号引起来就好，如下：

Use the `printf()` function.

在需要高亮的代码块的前一行及后一行使用三个反引号，同时**第一行反引号后面表示代码块所使用的语言**，如下：

```java
// FileName: HelloWorld.java
public class HelloWorld {
// Java 入口程序，程序从此入口
public static void main(String[] args) {
    System.out.println("Hello,World!"); // 向控制台打印一条语句
}
}
```

支持以下语言种类：

```
bash
clojure，cpp，cs，css
dart，dockerfile, diff
erlang
go，gradle，groovy
haskell
java，javascript，json，julia
kotlin
lisp，lua
makefile，markdown，matlab
objectivec
perl，php，python
r，ruby，rust
scala，shell，sql，swift
tex，typescript
verilog，vhdl
xml
yaml
```

如果想要更换代码高亮样式，可在上方**代码主题**中挑选。

其中**微信代码主题与微信官方一致**，有以下注意事项：

- 带行号且不换行，代码大小与官方一致
- 需要在代码块处标志语言，否则无法高亮
- 粘贴到公众号后，用鼠标点代码块内外一次，完成高亮

diff 不能同时和其他语言的高亮同时显示，且需要调整代码主题为微信代码主题以外的代码主题才能看到 diff 效果，使用效果如下:

```diff
+ 新增项
- 删除项
```

**其他主题不带行号，可自定义是否换行，代码大小与当前编辑器一致**

### 3.3 数学公式

> 支持平台：微信公众号、知乎。

行内公式使用方法，比如这个化学公式：$\ce{Hg^2+ -> HgI2 -> ^2-}$

块公式使用方法如下：

$$H(D_2) = -\left(\frac{2}{4}\log_2 \frac{2}{4} + \frac{2}{4}\log_2 \frac{2}{4}\right) = 1$$

矩阵：

$$
\begin{pmatrix}
1 & a_1 & a_1^2 & \cdots & a_1^n \\
1 & a_2 & a_2^2 & \cdots & a_2^n \\
\vdots & \vdots & \vdots & \ddots & \vdots \\
1 & a_m & a_m^2 & \cdots & a_m^n \\
\end{pmatrix}
$$

公式由于微信不支持，目前的解决方案是转成 svg 放到微信中，无需调整，矢量不失真。

目前测试如果公式量过大，在 Chrome 下会存在粘贴后无响应，但是在 Firefox 中始终能够成功。

### 3.4 TOC

> 支持平台：微信公众号、知乎。

TOC 全称为 Table of Content，列出全部标题。



由于微信只支持到二级列表，本工具仅支持二级标题和三级标题的显示。

### 3.5 注音符号

> 支持平台：微信公众号。

支持注音符号，用法如下：

Markdown Nice 这么好用，简直是{喜大普奔|hē hē hē hē}呀！

### 3.6 横屏滑动幻灯片

> 支持平台：微信公众号。

通过`<![](url),![](url)>`这种语法设置横屏滑动滑动片，具体用法如下：

<![蓝1](https://markdown.com.cn/images/blue.jpg),![绿2](https://markdown.com.cn/images/green.jpg),![红3](https://markdown.com.cn.jpg)>

## 4 其他语法

### 4.1 HTML

支持原生 HTML 语法，请写内联样式，如下：

<span style="display:block;text-align:right;color:orangered;">橙色居右</span>
<span style="display:block;text-align:center;color:orangered;">橙色居中</span>

### 4.2 UML

不支持，推荐使用开源工具`https://draw.io/`制作后再导入图片


## 5 致谢

* 歌词经理 (https://github.com/lyricat/wechat-format "灵感来源")
* 颜家大少 (http://md.aclickall.com/ "MdA2All")

页: [1]
查看完整版本: Markdown 编辑器帖子样本演示