Tab 支持、富文本、多语言支持、可配置、主题和样式,所以第一步就是安装 node.js

发布时间:2020-02-11  栏目:新葡京32450网址  评论:0 Comments

Nick 觉得这种顺滑感是其他 Windows
应用都不具备的,甚至是最轻量的 notepad.exe 都未能提供这种输入体验。他还问到,这种 UI
增强功能将来是否会应用于所有 Windows 应用程序。

图片 1

所谓“生产环境”是指应用程序正式上线运行所用的软硬件环境,多为安装了Linux操作系统的高性能计算机,集中放置在专用机房中,通过网络远程访问。开发者通常还会配置一个“模拟生产环境”来进行发布前的测试——Linux可以在实体机上安装,也可以在其他操作系统管理的虚拟机上安装(例如Win10自带的虚拟机工具Hyper-V),但最简便的方式则是打开Win10的微软应用商店直接安装——这种Linux是基于“适用于Linux的Windows子系统”(Windows
Subsystem for Linux,简称WSL),启动比虚拟机更快,性能也更好。

1.2、全局安装 electron

npm install -g electron-prebuilt

mac 系统需要在管理员权限下安装哟,输好密码就可以开始等他安装了。

sudo npm install -g electron-prebuilt

全局安装后就可以在命令行使用 electron 工具
全局安装之后,就可以通过 electron . 启动应用,当然也可以选择局部安装。

很快,负责此项目的 Windows
开发团队成员(@miniksa)对 Nick
的疑问进行了解答。

但是由于控制台主要的目标是维护向后兼容性,所以尽管这么多年社区一直希望我们能添加一些特性,但是我们不可能再增加这些特性。

图片 218_ssh.png

3.2.1 使用 brew 安装 Wine

  • 打开终端,输入以下命令行:

brew install wine

出现以下错误,提示我们安装缺失组件,下一步就是安装缺失组件了。

提示安装缺失组件

  • 安装缺失组件 Xquartz
    浏览器打开https://xquartz.macosforge.org/landing
    下载并安装即可

  • 重试安装 Wine

brew install wine

接下来的事就是等待了,我等了一个上午吧~~ that’s a really long time

  • 使用命令行打包 Win32 安装包

electron-packager ./ cyyDemo --platform=win32 --arch=x64 —version=1.3.5 --out=dist/ --overwrite --ignore=node_modules/electron-* --ignore=node_modules/.bin --ignore=.git --ignore=dist --prune

原创作品,如需转载,请与作者联系,否则将追究法律责任。

miniksa 表示,保持在 WSL
默认终端输入内容的速度比其他应用快,这实际上就是他们唯一的工作!除此之外,也可能是因为他们必须使用
Windows 最旧和最低级别的 API 来完成此项工作。

该项目使用 git submodules
包含一些相关依赖,要确保子模块被更新,请在构建器使用如下命令检查:

图片 318_shell.png

1.3、安装打包工具 electron-packager

npm install -g electron-packager

同样,mac 系统需要在管理员权限下安装哟

sudo npm install -g electron-packager

打包需要注意的点会在后面讲解

miniksa 解释道,notepad.exe
确实很轻量,不过在其窗口上也具有多个控件,并且可能在编辑控件中使用某种库、框架来确定其文本布局(也可能正在使用其他库或框架进行国际化支持…),这些都使得它们的输入速度比不上
WSL 默认终端。当然,WSL
也需要进行权衡取舍,它不像其他应用那样提供完全的国际化支持。

nuget restore OpenConsole.sln
msbuild OpenConsole.sln

今后你也可以选择在实体机上安装Linux作为日常主力系统,推荐Xubuntu——就是集成了Xfce桌面环境的Ubuntu

3.1 mac os 环境下打包 mas 安装包

WSL 的默认终端不像 Electron
等框架那样涉及到许多其他的层或框架,它有一个并不特别的裸窗口,并且没有任何附加组件。他们会从窗口消息(window
messages)而不是某种事件框架((WPF, WinForms, UWP,
Electron))来处理键入的内容,而这些内容是通过内核传输过来的。接着,他们使用
GDI 的 PolyTextOut 将文本直接转储到窗口而不带多余的装饰。

Windows Terminal

deb http://mirrors.cloud.tencent.com/ubuntu/ bionic main restricteddeb http://mirrors.cloud.tencent.com/ubuntu/ bionic-updates main restricteddeb http://mirrors.cloud.tencent.com/ubuntu/ bionic universedeb http://mirrors.cloud.tencent.com/ubuntu/ bionic-updates universedeb http://mirrors.cloud.tencent.com/ubuntu/ bionic multiversedeb http://mirrors.cloud.tencent.com/ubuntu/ bionic-updates multiverse#deb http://mirrors.cloud.tencent.com/ubuntu/ bionic-backports main restricted universe multiversedeb http://mirrors.cloud.tencent.com/ubuntu/ bionic-security main restricted universe multiverse

一、环境搭建

它的方式是使用 nodeJs API 调用系统资源,所以第一步就是安装 node.js
环境哟。

图片 4

此外,我们意识到终端的渲染器和输入堆栈可以构建成可重用的 Windows UI
控件,方便其他人可以将其合并到其他应用程序中。

$ echo "xfce4-session" > ~/.xsession$ sudo service xrdp start

3.1.2 命令行打包

在你项目工程的文件下,输入以下命令进行打包(为了好说明,我把空格换成换行符了)。

electron-packager 
./          //location of project
cyyDemo   //name of project
--platform=mas 
--arch=x64 
--version=1.3.5 //electron version
--out=dist/ 
--overwrite 
--ignore=node_modules/electron-* 
--ignore=node_modules/.bin 
--ignore=.git 
--ignore=dist --prune
  • location of project 是你项目文件夹的位置,
  • name of project 定义你的项目名,
  • platform 决定要构建的平台(包括 Windows,Mac 和 Linux,all
    表示所有平台 )
  • architecture 决定构建哪个构架下( x86 或 x64 ,all表示两者),
  • electron version 让你选择要用的 Electron 版本

命令的选项理解起来都比较简单。为了获得精美的图标,你首先要找一款可以把
png 文件转换到这些格式的工具,把它转换成 .icns 格式( Mac 用)或者 .ico
格式( Window 用)。如果在非 Windows 系统给 Windows
平台的应用打包,你需要安装 wine( Mac 用户用 homebrew,Linux 用户用
apt-get
)。另外,第一次打包用时比较久,因为要下载平台的二进制文件,随后的打包将会快的多。

(文/开源中国)    

构建一个全新终端

$ sudo apt update # 更新软件包列表$ sudo apt list --upgradable # 查看哪些软件包可更新$ sudo apt upgrade python3.6 # 更新Python3.6,不指定名字则更新全部软件包$ sudo apt install python3-pip # 安装Pyhon3.6的pip$ python3 -m pip list # 查看Python3.6的第三方包列表$ sudo apt install python3.7 # 安装Python3.7$ sudo apt install python3.7-venv # 安装Python3.7的venv$ python3.7 -m venv vTest # 基于Python3.7创建一个虚拟环境$ source vTest/bin/activate # 激活一个虚拟环境

二、简单开发

那么,我们 Electron 程序到底是怎么跑起来的呢?先看下一个 Electron
项目的基本框架组成吧。

为什么要这样做?第一,conhost.exe
已十分陈旧。它必须使用所有内容的裸机底层,因为它是在创建其他大多数框架之前创建的。第二,它需要保持尽可能底层的级别,而且它是用
C/C++ 编写的,它需要尽可能保持底层的状态以方便提供给第三方使用。

Windows Terminal
是一个全新的、流行的、功能强大的命令行终端工具。包含很多来社区呼声很高的特性,例如:多
Tab 支持、富文本、多语言支持、可配置、主题和样式,支持 emoji 和基于 GPU
运算的文本渲染等等。

$ sudo apt install xfce4 xrdp fonts-wqy-microhei

3.1.1 在 package.json 中添加安装包依赖

"devDependencies": {
        "electron-prebuilt": "^1.3.5",
        "electron-packager": "latest"
    }

一名开发者(下用 Nick 代称)在 Windows Terminal 的 GitHub repo
中发表了一个不是反馈问题的 issue ——
他只是好奇该终端拥有这种如此顺滑输入的效果是如何实现的。

git submodule update --init --recursive
"""xtextcolor.py 在*nix终端中输出彩色文本(使用第三方包colorama也可以在Windows中实现此效果)"""# from colorama import init# init()print("\033[1;30m灰色文本\033[0m")print("\033[1;31m红色文本\033[0m")print("\033[1;32m绿色文本\033[0m")print("\033[1;33m黄色文本\033[0m")print("\033[1;34m蓝色文本\033[0m")print("\033[1;35m品红色文本\033[0m")print("\033[1;36m青色文本\033[0m")print("\033[1;37m白色文本\033[0m")print("\033[1;37;40m白色文本黑色背景\033[0m")print("\033[1;36;41m青色文本红色背景\033[0m")print("\033[1;35;42m品红色文本绿色背景\033[0m")print("\033[1;34;43m蓝色文本黄色背景\033[0m")print("\033[1;33;44m黄色文本蓝色背景\033[0m")print("\033[1;32;45m绿色文本品红色背景\033[0m")print("\033[1;31;46m红色文本青色背景\033[0m")print("\033[1;30;47m灰色文本灰色背景\033[0m")

2.2、初次开发踩坑记录

  • Electron 加载带 jquery 的项目报错
    solution:
    详细解答可以查看这里

<!-- Insert this line above script imports -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
<!-- normal script imports etc -->
<script src="scripts/jquery.min.js"></script> 
<script src="scripts/vendor.js"></script> 
<!-- Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>

Benefits
Works for both browser and electron with the same code
Fixes issues for ALL 3rd-party libraries (not just jQuery) without
having to specify each one
Script Build / Pack Friendly (i.e. Grunt / Gulp all scripts into
vendor.js)
Does NOT require node-integration
to be false

  • Electrons 使用网络请求
    solution:原来也有很多库提供给我们使用的,使用方式方法也很简单。
    superagent
    superagent
    是一个极其简单的 AJAX
    库。看过下面例子,相信机智的你已经知道怎么使用了吧。

var request = require( 'superagent' );
request 
.get( 'http://xxx.com' ) 
.end( function ( err, res ) { 
// Do something
});

bluebird
bluebird
是一个 Promise 库。

凡是类似 IO 的操作,必定需要异步。经典的解决方法是回调,然而是时候用
Promise 了!
bluebird
声称拥有无与伦比的速度。其实更实用的功能是它支持能够将一些本身是不支持
Promise 的库转化为支持 Promise 的库。
然而,要配合之前的 superagent,则需要另外一个库
superagent-bluebird-promise。superagent
本身不支持 Promise,从上面的代码来看就是使用回调的方法,这个库就是将
superagent 和 bluebird 融合在一起的“融合卡”。使用的时候只需要:

var Promise = require( 'bluebird' );
var request = require( 'superagent-bluebird-promise' );
request 
.get( 'http://xxxx.com' ) 
.then( function ( res ) { 
// do something when resolved 
}, function ( err ) {
 // do something when rejected 
});

立刻就可以使用上 then了,方便吧。

相关文章

留下评论

网站地图xml地图