[个人项目] 用 Elec<span class=nginx配置tron + Vue3 + Golang 做个一个桌面 Markdown 笔记软件” src=”https://www.6hu.cc/files/2022/01/adde0awindows10激活密钥653039def19b592368f50a38markdown数学公式b5.png”>

需求是在主窗体启动之前需要启动后台服务,一直以为应前端开发该是前端工程师放在 main.js 里,结果操作了好几次都无法成功,后面想想要不就放在 background.js 里试试,然后就可以了。估计是 main.js 是 Vue 项目里的主程序脚本,打包后无法获取外部程序的路径或者无权操作外部程序,而 background.js 才Markdown是 Electron 的主程序脚本,只有它才能通过 Node 来操作系统文件。

参考资料:

掘金:通过 electron 启动其它exe 程序

Node.js 中文网:Node.js v16.13.2 文档

博客园:Nodejs进阶:如何玩转子进程(child_process)

6.3 Golang 项目的绝对路径问题

由于 Golang 编译好的服务端是需要markdown语法用过 Electron 通过子进程调用实现的,因此启动目录不是预想的路径,原以为使用 ./ 就可以启动的(因为开发是用 go run ./main.go 的时markdown翻译候确实是没问题的),结果笔记数据库 note.db 愣是直接给建到了 Electron 的根目录,然后 /Static 文件夹访问不了,这才发现问题所在。但测试了一番之后才发现 Golang 的路径 run 和 build 居然都会返回开发文件夹的路径,也就有点坑爹了,最后经过多方寻找资料,才得以解决:

func main() {
    appPath, _ := os.Executable()
    currentFolderPath = filepath.Dir(appPath)
    println(currentFolderPath)
}

参考资料:

知乎:彻底解决Golang获取当前项目绝对路径问题

7 后记

以上就是所有的开发过程,利用业余时间,前前后后花了 3 周吧,把这个工具整出来了,还是很有windows10激活密钥成就感的。除了收获了一个自己的笔记工具外,还收获了接触新技术的经验,为后面的开发开了一个好头,未来在开发桌面级应用时测试有了一个新的选择。

对了,前端面试题这篇文章就是用这个工具写的。

[个人项目] 用 Electron + Vue3 + Golang 做个一个桌面 Mark<span class=markdown编辑器down 笔记软件” src=”https://www.6hu.cc/files/2022/01/1d74bwindows更新有必要吗89b927fdf271564nginx反向代理4d2c32f382f0.png”>

以上就是所有的布局了:

  • 上方负责标题栏和窗体控制
  • 左侧负责笔记导航
  • 右侧最大的区域负责笔记的编辑

界面 UI前端开发需要学什么 上尝试了最近关注度比较高的 新拟态 效果,由于界面设计比较简单,总体来说效果还是不错的。由于是自己开发的,后期如果有什么新效果,也可以尝试往里面放markdown语法,嗯,可以折腾一下

具体代码,详见 gitee 仓库 gitee.com/Ywindows许可证即将过期怎么办ogurt_cry/…

5.2 服务端开发

加上上次做云服务器版的开发,这次算是第二次用 Golan测试你的自卑程度gwindows怎么激活发项目了。项目比较简单,再加上是单机版的,笔记的 CURD 才是关键点,因此代码合计下来也不过才 290 行。主要是实现了:检索新建保存删除获取,也就是 CURD。

所以使用 Golang 来操作 sqlite3windows7旗舰版 就是关键,不知道该怎么处理,所以就参考了一下网上大神的操作,完成了开发。

参考资料:

知乎:golang操作sqlite3

6 打包经历

相比于打包来说,开发上面其实没有花多长时间,前端开发最花时间的就是 windows许可证即将过期怎么办拟态 的阴影,调试了很nginx启动命令久才出来自己比较满意的效果。

对于桌面开发习惯了 Visuwindows更新有必要吗al Studi前端和后端哪个工资高oF5 运行测试,F6 编译解决方案的我来说,打个包还会出各种各样幺蛾子的 Electron 着实是有点不习惯。

原以为只要一个:

npm run electron:build

就可以解决所有问题,结果花了我 5测试手机是否被监控 个多小时去处理各种各样的异常错误。

6nginx配置.1 Electro测试用例n 打包配置

这是第一个没想到的问题,第一次打包完后启动不了,嗯。。。准确的说应该是启动了,但是没法进入项目,就一个黑屏。跟 Vue 打windows7旗舰版包完后没有通过 Nginx 配置的效果一样。

最终通过多方寻找资料,才知道用 vue-cli-plugin-electron-builder 原来是需要写配置文件的。。。还以为全都搞markdown下载好了markdown是什么意思

参考资料:

简书:在vue-cli-plugin-electron-builder测试下用electron:build打包或生成应用程序的markdown软件两种方markdown下载nginx重启

简书:electron-builder打包指定资源到安装目录

CSDN:electmarkdown语法ron如何使用webpack打包webview标签中的preload文件

Vue Cli:Vue Cli 插件 Electron Builder

electron-builder:Any Windows Target

6.1.1 Electron 打包Markdown时 preload.js 没有输出的问题

嗯,这也是打包配置文件的问题。

6.1.2 Electron 打包时外部程序前端和后端的区别没有输出的问题

嗯,这也Windows是打包配置文件的问题。

打包参考示例如下:

module.exports = {
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        appId: 'com.ccsdesgin.note',
        productName: '创云笔记',
        copyright: 'Copyright  2022',
        directories: {
          output: './dist_electron'
        },
        extraResources: {
          from: './server',
          to: 'server'
        },
        win: {
          icon: './public/favicon.ico',
          target: [
            {
              target: 'nsis',
              arch: [ 'x64' ]
            }
          ]
        },
        nsis: {
          oneClick: false,
          allowElevation: true,
          allowToChangeInstallationDirectory: true
        }
      },
      preload: './src/preload.js'
    }
  }
}

6.2 child_p测试智商ro测试工程师cess 无法启前端和后端动子进程的问题

一开始 Yogurt 是放在markdown语法 main.js 里的,就是 Vue 项目的 main.js 里。就一直在报找不到文件。后面也是因为解决了外部文件Markdown引入的问题,才真正得以解决。

[个人项目] 用<span class=windows怎么激活 Electron + Vue3 + Golang 做个一个桌面 Mwindows是什么意思arkdown 笔记软件” src=”https://www.6hu.cc/files/2022/01/b21a830db2e37f4b788150d494fc77f8.png”>

软件功能比较简单,所以界面布局也一切从简了。

markdown语法桌面 Markdown 笔记软件” alt=”[个人项目] 用 Electron + Vue3 + Golang 做个一个测试抑郁程度的问卷桌面 Markdown 笔记软件” src=”https://wwwnginx怎么读.6hu.cc/wp-contemarkdownpadnt/uploads/2022/01/248bb57416675c8975dc79c94bc3ce22.png”>

运行的依赖,也就是引入的外部组件如下:

1 前言

在 2021 年底的时候,先是用 Leanote 搭了一个私有的云笔记服务器,后面嫌弃功能不够强大,页面不够好看,基于 Vditor 组件又给自己做了一个云服务器版的笔记软件。但是吧,Vditor 功能很全面,但就是包有点太大了,网络不好的时候还打不开,着急要看笔记的markdown数学公式时候有点尴尬。还有一个问题是,云服务器当时买回来就是拿来Nginx测试的,说不准哪天就重装了,没打算长时间存储数据,还会面临忘记续费的尴尬,再说了,目前技术能力和时间精力也比较有限,服务器的安全性也是个头疼的问题。思来想去,感觉借着上次的经验,可以搞一个本地markdownpad的笔记软件。

2 需求分析

作为一个自用标准的笔记软件,目前的需求如下:

  • 界面markdown换行好看,暗黑色系。日常使用的软件基本都是暗黑的,夜间场景比较多,各种切换不要受到影响
  • 交互越少越好,专windows是什么意思注与笔记本身。什么登录啊、弹窗啊、广告啊什么的,统统不要,能 CURD 就行。
  • 支持全局搜索,一个文件管理所有的笔记
  • Markdown 编辑所见即所得,像 Typora 一样

3 技术选型

根据需求,结合自己目前所了解的技术能力,做如下选型:

  • 前端是什么工作心组件:作为一个 Markdown 笔记,最重要的就是渲染器了,Vditor 是目前自己能找到的最好的一款 Markdown 组件了。再说了,上次在开发云服务器版的时候也有了一定的经验(有老代码可以抄)因此所有辅助类型的技术选型都将围绕于此。
  • 桌面部分:既然前端和后端哪个工资高核心组件已经是一个 Web 前端项目了,那么作为载体,必然就是一个浏览器了,这里一开始有两个方案可以选择。一是使用 C# 开发,在 Winform 中嵌入 Chr测试你的自卑程度omium 浏览器部件 ——Cefsharp。这也算windows10激活密钥是比较有前端工程师经验的操作,毕竟利用这个部Nginx件开发过一个爬虫工具。之所以最终windows11有必要升级吗没有选用,则是因为界面设计上没法达到个人的审美要求,以及在使用 WPF开发测试你适合学心理学吗时,嵌入 Chromium 后输入法的焦点前端电视剧无法定格在主界面,因此该方法直接流产了。第二个方案则是当前成品的方前端面试题案了,使用 Electron 框架前端电视剧来开发。显而易见,效果很好。Vditor 支持 Vue3,所以桌面部分就用 Electron + Vue3 来开发即可。
  • 服务端:就目前 Yo前端面试题gurt 对 Node.js 的技术理解程度而言,Electron 仅仅能帮忙解决前markdown是什么意思端效果呈现的问题,而操作数据存储和图片存储等相关的问题上暂时没有办法通过 Node.markdown语法js 来解决,此时就需要考虑使用别的手段。目前有三nginx安装与配置详解个方案:Python、C# 和根本就不太熟的 Gomarkdown是什么意思lang。三者的测试你适合学心理学吗优劣也比较清晰,Python 是目前个人的主力语言,熟悉且开nginx安装与配置详解发速度快,各种各样的包也比较多。C# 也比较熟悉,关键是最倾向的一个轻量级 NoSQL 数据库 —— liteDB 仅支持 .NET 环境。Golnginx怎么读ang 就非常不熟悉了markdown翻译,才接触了不到 2 个月,处于一windows键是哪个个边写边忘前端和后端测试你的自卑程度阶段。最终考虑到桌面前端和后端应用运行环境安装和维护的便捷性,以及本次服务端的开发重点,抱着学习的nginx怎么读心态,最后选择了 Golang 作为服务端的开发语言。
  • 数据库:开发的侧重点是桌面级应用nginx重启,因此对数据存储的首要要求就是轻量,其他部分只要满足正常的 CURD 就足够了,一个前端开发人写个笔记,也没啥性能瓶颈。个人理想中是想选择一个轻量级的单文件 NoSQL 数据库的,后面找了半天没找到合适的markdown翻译,最后还是回到了经典数据库的怀抱 —— Sqlite3

4 开发环境

信息 说明
操作系统 Microsoft Windows 10 专业工作站 10.0.1markdown编辑器9042 64位
开发工具 Visual Studio Code
Vditor 版本 3.8.10
Elecwindows怎么激活tron 版本 13.0.0
Vue 版本 3.0.0
Node 版本 16.13.1
NPM 版本 8.1.2
Golang 版本 go version go1.17.5 windows/amd64
Sqlite3 版本 3.32.3测试工程师

5 开windows11有必要升级吗发经过

5.1 前端开发

一开始是打算将 VueElectron 分开,先把 Vue 的部分完成,再用 Elecwindows10激活密钥tron 打包,奈何自己markdown翻译Electron 实在是不够熟悉,索性就windows10算了。后面发现 Vue 支持 Electron,然后就用

vue ui

前端电视剧markdown换行来创建 Vue 项目了。已安装的插件如下: