前言
最近在学习阶段,要学习一款可以支持前端语言开发桌面程序的框架Sciter,因此来了解学习一下。
介绍
Sciter是一款可嵌入的 HTML/CSS/JavaScript 引擎，用于桌面UI开发。
Sciter Engine 是一个大小为 5+ Mb 的单个紧凑 DLL。使用它的应用程序比使用Electron或Qt构建的应用程序小10+倍。而分发的规模很重要。
官方文档：sciter – 用于桌面和移动应用程序的多平台 HTML/CSS/JavaScript UI 引擎
简单应用
- 下载Sciter SDK,
官方下载：Download / sciter
- 应用结构
基本的结构如下：
Sciter的bin目录下包含了各个平台系统的编译结果,我们可以打开一个来看一下效果。
点击进入sciter-js-sdk-main -bin -> windows -> x64，选择
usciter.exe
可以看到sciter的应用界面，如下：
- 如何使用
首先在自己电脑上创建一个文件夹project，在project下添加文件index.htm。打开index.htm，加入代码
注意：HTM与HTML没有本质意义的区别，只是为了满足磁盘操作系统（DOS）仅能识别三位文件名而已。因为一些老的系统(win32)不能识别四位文件名，所以某些网页服务器要求
index.html最后一个l必须去掉。（因为html识别不了，只能识别htm）。
<html>
<body>
<h1>Hello Sciter~</h1>
</body>
</html>
- 导入到打开的应用程序中
打开我们刚刚启动的sciter win编译程序,导入index.htm，就可以看到界面啦。
- 调试
打开DOM inspector，在这里面就可以看到文件的DOM结构，记得每次打开时要热更新重载一遍。
- 打包
先下载图片打包工具ImageMagick – Download，下载 ImageMagick-7.0.11-14-portable-Q8-x64.zip，然后配置好环境变量，如下：
打开sciter-js-sdk-main -> bin -> quark -> windows下的应用程序打包器。
- 效果
进入project -> bin -> windows -> x64，执行project.exe就可以看到我们写的代码页面啦~
总结
Sciter本质上还是应用在桌面上的应用，因此很多会出现很多浏览器特性无法兼容的问题，其次Sciter目前对CSS3和ES6的兼容性也不太友好，也正是由于这些兼容性问题，它对现有的一些前端框架(vue、react等)的支持程度不高。而且在开发过程，调试不太方便，开发效率一整个降低。当然好处就是，很好地锻炼了我前端的基本功（基本全程用原生js）。看到这里啦，不妨点个赞呗~
扫一扫
758
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
