从零开始使用Electron + jQuery开发桌面应用

从零开始使用Electron + jQuery开发桌面应用

Electron介绍
现现在，用 HTML、JavaScript、CSS、Node.js 写桌面应用早已不是什么新鲜的事了，做为一名前端，可以使用本身熟悉的语言，快速实现本身想要的桌面应用，是件很让人兴奋的事。
目前常见的有 NW、heX、Electron。今天，就来简单的上手一下 Electron。

Electron 是什么？
Electron 是一款能够利用 Web技术 开发跨平台桌面应用的框架，最初是 Github 发布的 Atom 编辑器衍生出的 Atom Shell，后改名为 Electron。

Electron 能作什么？
Electron 内置了 Chromium 内核 和 Node，所以可使用 HTML 和 CSS 来实现应用的 GUI 界面，用 JavaScript 调用丰富的原生 API 实现桌面应用。你也能够将 Electron 看做是一个由 JavaScript 控制的一个小型的 Chrome 内核浏览器。

因为内置的 Chromium 内核 和 Node, 所以咱们不须要关心前端的兼容问题，你甚至能够写 -webkit- only 的代码; 也不须要关心一些须要编译的 Node 模块兼容问题，由于 Node 版本是固定的。所以，用 Electron 来编写跨平台应用程序是很是合适的。

Electron + jQuery
得知能够直接把web网站打包成桌面应用程序，我顿时乐开了花。赶忙去助赢官网查了资源，工欲善其事，必先利其器。首先得把工具down下来。
手上恰好有个web网站，我就拿他试水吧。不过我没有照官网的教程。我对前端自认为是过关的，我就略过了js，css等等
一个最简单的electron项目包含三个文件, package.json, index.html, main.js
为了把mvc网站嵌入到桌面应用中去，在index.html里面添加我mvc的锚文本。刷新electron,点击锚文本就能看到网站内容了，心情好激动呀。很快这刺激就过了，点击事件都不能正常响应。打开调试看看吧，console里面提示说$没有定义。明明网站就有引用，为何还会提示这jb问题了。electron是否是傻了。

回想一下，electron是基于Chromium 环境依赖于Node.js，那应该是引用的姿式不对了。前两天看jquery源码开头就有一段说是提供给node.js使用的，为何在我手上就是不能正常使用了。带着这个疑问去查了查相关资料，发现引用jquery前得告诉jquery我如今的环境是Node.js。

后面jquery开发就和日常写代码同样了。