houfeng / mditor Goto Github PK

View Code? Open in Web Editor NEW

535.0 26.0 79.0 15.8 MB

📝 [ M ] arkdown + E [ ditor ] = Mditor

Home Page: http://mditor.com/

HTML 24.86% CSS 10.29% JavaScript 64.58% Shell 0.27%

mditor markdown markdown-editor markdown-parser markdown-to-html md markdown-viewer markdown-converter

mditor's Introduction

简单说明

Mditor 最早只有「组件版」，随着「桌面版」的发布，Mditor 目前有两个版本：

可嵌入到任意 Web 应用的 Embed 版本，这是一桌面版的基础，Repo: https://github.com/houfeng/mditor
独立的桌面版本，目前仅有 Mac 版本，主页：http://mditor.com，Repo: https://github.com/houfeng/mditor-desktop

如何参与

如果有任何问题或建议，可以直接发起 Issue
当然，你也可以直接向 Mditor 发起 Pull Request
非常欢迎，直接给 Mditor 加个 Star，这将是对 Midior 不错的鼓励，它会变成动力。

开发指南

Clone 源码

$ git clone [email protected]:Houfeng/mditor-desktop.git your_path

安装依赖

前提是需要安装好 Nodejs 和 npm（建议用 cnpm 可以通过国内镜象加速）

$ npm install

自动构建

将会自动进行基于 Webpack 的构建（部分资源需要 Webpack 打包），并将 Watch 文件的改动然后自动进行构建

$ npm run dev

启动程序

将会启动开发中的 Mditor

$ npm start

mditor's People

Contributors

Stargazers

Watchers

mditor's Issues

不支持iframe解析吗？

宽度较小时，工具条溢出问题

在移动端会碰到此情况，如下图：

有没有相关的调试方法什么的？

我想把您的项目做成WordPress的插件，过程中发现如下问题：

所以想问问有什么办法在控制台查看相关报错信息，谢谢！

npm 的cdn 里面的资源不是最新的了

npm 的cdn 里面的资源不是最新的了，使用的时候不会执行 ready 方法，恳请作者能不能支持模块化加载

ready事件和change事件进不去

问题如图，ready事件进不去

楼主超赞👍

基本上你的这个编辑器全部满足自己的需求，前端编辑器可视化编辑，后端接受markdown格式字符串存入数据库，在node层面做解析。但是如果可以选择不同的代码高亮皮肤就更好了

怎么判断编辑器是在全屏的状态？

标题。。

npm方式下载的包，只引出了Parser方法。

我在想前端工程里使用您的项目，但是发现我用npm下的包只引出了Parser方法。
如果我想用这个项目的话，只能通过script的方式使用吗？

补充：
刚刚我看了一下，发现src/server/index里的确只有暴露出了Parser和version这两个不知道方不方便做一下修改？

如何在ｔｅｘｔａｒｅａ中加入ｉｎｐｕｔ元素

你好，我在ｎｏｄｅ项目中使用了Mditor，现在有个问题是我修改ｊｓ代码在 textarea元素中加入了一个input元素作为文章标题，执行后ｈｔｍｌ结构中有ｉｎｐｕｔ元素，但页面中却找不到，请问这个问题应该怎么解决．

支持到IE哪个版本

很喜欢mditor ，请问支持到IE哪个版本？

崩溃情况

已经出现过几次了，如果文档写的稍微大了一点就会出现崩溃（不知是否是这个原因，几次出现的情况都是这样），崩溃后再次打开一编辑又崩溃

可以es6模式引入吗

react页面渲染

hi，我发现当我编辑时，样式比如是比较完美的，但是当我用parser.parse渲染的时候发现并没有展现出预期的样式效果，而是一堆字符串，只好使用react的自带的html渲染来做，但是使用dangerouslySetInnerHTML={{
__html: ${data.content}
}}
会发现有很多样式根本无法渲染，请问是不是服务端的parse有问题？

有没有提供解析markdown的接口

在客户端~

建议分离font-awesome，可以通过配置是否需要加载，项目中已经加载了

希望扩展img功能，请问如何监听img打开的事件？另外如何在当前光标处写入字符？

有没有考虑IE高本版支持，IE11乱成dog

加油

看了这个比很多md组件都好用，试用后特来感谢！

怎么移除编辑器?

在dialog中创建编辑器,多次弹出dialog会创建多个编辑器

可否支持　空格缩进　　不然　文章　全是一堆的　　不好阅读啊

期待图片上传的功能

和vuejs冲突

vujs 和 mditor都用{{}}，编辑器加载不出来，有如下错误：

class="mditor {{split?'split':''}} {{preview?'preview':''}} {{fullscreen?'fullscreen':''}}": Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of
, use
.
style="width:{{width}};height:{{height}}": Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of
, use
.
class="finder {{active?'active':''}}": Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of
, use
.

(found in )

如何设置高度？

目前编辑器高度是默认值，怎么自己设置呢？

能支持流程图吗？

可以增加一个vue-cli项目的模板吗

小白看完文档想在vue-cli的项目使用 mditor 发现报错
我在vue-cli 项目的index.html中引入

   <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>oscweb</title>
    <link rel="stylesheet" type="text/css" href="/static/css/mditor.min.css">
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
		<script type="text/javascript" src="/static/js/mditor.min.js"></script>
  </body>
</html>

在使用的时候

    mounted () {
      this.$nextTick(function () {
        var mditor = Mditor.fromTextarea(document.getElementById('editor'))
        mditor.on('ready', function () {
          console.log(mditor.value)
          mditor.value = '** hello **'
        })
      })
    }

控制台告知我Mditor not defined
然后我通过npm 安装 mditor
在.vue文件中

import Mditor from 'mditor'

控制台输出信息

[Vue warn]: Error in nextTick: "TypeError: __WEBPACK_IMPORTED_MODULE_0_mditor___default.a.fromTextarea is not a function"

found in

---> <AddRes> at C:\git\OSCourse\oscweb\src\components\add_res.vue
       <App> at C:\git\OSCourse\oscweb\src\App.vue
         <Root>

希望知道如何在vue项目中使用mditor
希望可以增加一个vue项目使用的demo

请问如何在客户端解析markdown语法？

就是一段纯markdown语法的文本，怎么用mditor解析成html？

网页中teatarea编辑区域不能适应浏览器的高度

请问在后端解析出来的HTML,怎么在前端显示出与预览一样的效果

TR~
返回的是纯的html
没有样式

placeholder

是否支持react

可否上传至CDN

这个项目非常不错，给作者点赞 👍

我准备在 tale 项目中使用，可否将发布的js/css 发布到CDN上，比如 http://www.bootcdn.cn 或者其他的前端CDN

还有个小tip，希望把 toolbar 的选项列举出来 😄

Uncaught TypeError: Function.prototype.toString requires that 'this' be a Function

@Houfeng 感谢分享，然后我在web上调用的时候，出现这个错误，请问是怎么回事呢？非常感谢~

错误提示： Uncaught TypeError: Function.prototype.toString requires that 'this' be a Function

调用代码：

<textarea name="editor" id="editor"></textarea>
<script>
    //获取textarea dom对象
    var ele_textarea = document.getElementById('editor');
    //实例化Mditor
    var editor = new Mditor(ele_textarea);

</script>

在 fixedHeight 设为 false 时，会触发脚本执行

@qiayue

在 fixedHeight 设为 false 时，输入以下代码后，按下任何一个键，都会触发弹窗，也就是以下js代码被执行了

<script>alert(123);</script>

我会稍后复现并处理这个问题

Cannot read property 'parse' of undefined

var mditor = require("mditor");
var parser = mditor.Parser();

初始化mditor只有一种方式么？

初始化mditor 只有一种方式么？
mditor = window.mditor = Mditor.fromTextarea(document.getElementById('md-editor'));

我现在只想用Parser去解析markdown怎么办到呢？

如何获取完整的html（预览的html）？

保存编辑的内容时，直接存解析后的html（点击“预览”生成的html），这样在显示内容时不需要对md解析了。

请问有什么方式能卸载编辑器吗？

比如我需要通过一个选项组来切换是否是普通的富文本编辑器或者是markdown编辑器？
我发现mditor在渲染后就一直存在了，有没有什么方式能在选择普通富文本编辑器的时候让我卸载mditor渲染普通的编辑器？

程序外的复制无法粘贴

在窗口外的复制无法在程序里粘贴.
例如我在Chrome还是notepad里复制一段text, 在程序里无法粘贴.
但是在程序里复制就可以正常使用.

最新版里面，能否加个地理位置上去？？

先看看我添加的上传部分哈，哈哈

但是我看到一款编辑器也挺好的，就是没有 mditor 简便（个人想法哈）...，他里面有两个功能是很强大的....，你看看哈：
视频：

地理位置：

个人建议哈，目前这个版本的功能我也够用了

Uncaught TypeError: Cannot read property 'requestFullscreen' of null

问题如题

gpcc install

gpcc 安装记录

gpcc（Greenplum Command Center）是pivotal提供的Greenplum性能监控工具, 可监控各segment的状态、内存使用情况、磁盘io. 安装包可以在这里下载

安装步骤：

执行下面的命令，建立名为gpperfmon的数据库，默认使用gpmon用户
```[gpadmin@mdw ~]$ gpperfmon_install --enable --password gpmon --port 5432` ``

重启数据库

`[gpadmin@mdw ~]$ gpstop -r`

重启时报错，查看日志发现实pg_hba.conf文件配置出错，修改后就可以了

查看gpmmon进程是否已经启动
`` `gpadmin@mdw ~]$ ps -ef | grep gpmmon| grep -v grep```

4 . 查看Performance Monitor数据库写入数据是否正常，检查是否有记录写入
[gpadmin@mdw ~]$ psql -d gpperfmon -c 'select * from system_now'

如果配置了master的standby,拷贝Master主机拷贝配置文件到Standby Master的相应目录

[gpadmin@mdw ~]$ gpscp -h smdw /data/master/gpseg-1/pg_hba.conf =:$MASTER_DATA_DIRECTORY/
[gpadmin@mdw ~]$ gpscp -h smdw ~/.pgpass =:~/

安装gpccc，注意是root用户

[root@mdw local]# unzip greenplum-cc-web-3.0.1-LINUX-x86_64.zip
[root@mdw local]# ./greenplum-cc-web-3.0.1-LINUX-x86_64.bin
[root@mdw local]# chown -R gpadmin:gpadmin /usr/local/greenplum-cc-web
[root@mdw local]# chown -R gpadmin:gpadmin /usr/local/greenplum-cc-web-3.0.1

设置环境变量

[root@mdw local]# echo "source /usr/local/greenplum-cc-web-3.0.1/gpcc_path.sh" >>/home/gpadmin/.bashrc
[root@mdw ~]# echo "source /usr/local/greenplum-db-4.3.8.1/greenplum_path.sh" >>.bashrc 
[root@mdw ~]# source .bashrc
[root@mdw ~]# chmod 777 /usr/local/greenplum-cc-web-3.0.1/gpcc_path.sh
[root@mdw ~]# source /usr/local/greenplum-db/greenplum_path.sh
[root@mdw ~]# source /usr/local/greenplum-cc-web/gpcc_path.sh

在所有主机安装GPCCC

[root@mdw ~]# gpccinstall -f /home/gpadmin/conf/hostlist

复制配置文件到其他节点主机

[gpadmin@mdw ~]$ gpscp -h sdw1 .bashrc =:~/
[gpadmin@mdw ~]$ gpscp -h sdw2 .bashrc =:~/

配置安装详细项

gpcmdr --setup

   Please enter a new instance name:输入gpcc
   Is the master host for the Greenplum Database remote? Yy|Nn (default=N):n
   What would you like to use for the display name for this instance:gpcc
   What port does the Greenplum Database use? (default=5432):回车
   will you install workload manaager (default=N):Y
   What port would you like the web server to use for this instance?回车
   Do you want to enable SSL for the Web API Yy|Nn (default=N):n
   Do you want to copy the instance to a standby master host Yy|Nn (default=Y): 没有standby n
   What is the hostname of the standby master host? [mdw]:回车

启动实例
gpcmdr --start gpcc
登录 ip:28080

很简洁很大方；
分屏全屏很棒；
遗憾：没有快捷键，希望有，并且可以自定义；
遗憾：从 toolbar 点击插入代码后，ctrl+z 无法恢复到上一步；
遗憾：tab 可以缩进，但 shift+tab 无法取消缩进；
遗憾：-、* 无序列表及有序列表，按 enter 后下一行没有自动补全；

能否一次性上传多张图片 + 上传完毕后，即时预览？？

请问不支持[TOC]这种自动创建目录的语法吗？

很感谢，已经在使用了
RT~