vue-electron 写一个markdown文章编辑器(一)

缘起

以前看过一篇帖子，很多写作爱好者讨论写作时用什么markdown编辑器好，可惜当时我连markdown是何物都不知道，事后百度才明白是一种新的写作方式，语法很是简单，操作很是方便，让我这个只知道用word的有些汗颜，于是决定研究一番！

思路

当时看见的帖子有一个讨论点在于用markdown软件写作，图片是存在本地的，文章写好之后把文章复制粘贴到博客平台的话图片就失效了。当然也可以直接在简书或者思否这样的平台写好后再复制过去，但这些平台都对上传的图片做了一定的限制，比如图片必须小于5M。当时的解决办法是一部分直接在简书上写一篇不发表的文章专门用来存图片地址，也有人申请七牛云来专门存放图片然后复制图片地址来用！

目的

现在想写这样一个markdown编辑器主要就是为了解决上述问题
1、将插入到文章的图片都上传到七牛云空间，并获取返回地址。这样写文章的作者可以随时在七牛云查看自己存在的七牛云空间的图片，并且文章中的图片地址也是永久的网络地址，不用担心复制到其它平台会失效！
2、作者写的文章都保存在本地，方便写作者随时查阅修改！

编写

使用electron-vue创建项目

按官方的说法：
使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用

electron官网

vue init simulatedgreg/electron-vue md-editorcd md-editoryarn install

项目结构

运行项目

yarn run dev

然后会自动弹出一个软件窗口

然后就可以愉快的按写vue项目一样开些写程序了！

打包

强力推荐使用yarn，用npm打包一直卡在下载打包的必须文件上

可打包为win/mac/liunx三个平台下的桌面应用

yarn run build

打包之后在md-editorbuild文件夹下会有打包完成的项目

然后运行

md-editor.exe就可以打开这个桌面程序了

github地址

vue-electron 写一个markdown文章编辑器(一)相关推荐

animation基础练习源码_用vue简单写一个音乐播放组件「附源码」
作者:vipbic 转发链接:https://segmentfault.com/a/1190000022980992 前言上次小编也分享一个关于Vue 开发过音乐播放对项目: 基于 electron ...
down mark 打钩_推荐一个Markdown数学公式编辑器——Haroopad Mathjax
要在Markdown里插入数学公式,如果没有好用的的引擎or编辑器,那么只能插入图片了,十分麻烦.这里推荐一个十分强大的数学公式引擎--Mathjax. 配置有道云笔记目前不支持浏览MathJax公 ...
让我们写一个 Win32 文本编辑器吧 - 1. 简介
Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/cou ...
js桌面应用 Linux,从 1 到完美，用 js 和 electron 写一个桌面应用
从 1 到完美,用 js 和 electron 写一个桌面应用目前用 js 和前端技术写桌面软件的方案主要有两种:electron 和 nw.js.这两者在底层实现上有所不同,简单的说,electr ...
基于vue手写一个分屏器，通过鼠标控制屏幕宽度。
基于vue手写一个分屏器,通过鼠标控制屏幕宽度. 先来看看实现效果: QQ录屏20220403095856 下面是实现代码: <template><section class=&qu ...
使用PySimpleGUI模块，写一个正则表达式的编辑器
总流程分析需求代码实现代码说明 1. self.rule 2. self.columns和self.rule_button 3. self.window_location 下步改进 1. sel ...
2021了，你还不会用 Electron 写一个桌面应用？
正如 Electron 官方所说"如果你可以建一个网站,你就可以建一个桌面应用程序". ‍ 作为一个跨平台的桌面应用开发框架,Electron 的迷人之处在于,它是建立在 Chro ...
10分钟写一个markdown编辑器
marked.js Marked是一个Markdown解析引擎. vue.js Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vu ...
Electron实现一个简易的编辑器
众所周知,大名鼎鼎的VS Code编辑器是用Electron写出来的,近日因为工作需要,对Electron进行了复习和实践,写了一个简单的编辑器. 编器主要实现了这些功能:应用菜单.右键菜单.新建.打 ...

vue-electron 写一个markdown文章编辑器(一)

缘起

思路

目的

编写

使用electron-vue创建项目

打包

vue-electron 写一个markdown文章编辑器(一)相关推荐

最新文章

热门文章