排行榜 统计
  • 建站日期:2016-09-18
  • 文章总数:121 篇
  • 评论总数:148 条
  • 分类总数:10 个
  • 最后更新:昨天 21:39
热文技术

Electron基础 Hello,World!

本文阅读 3 分钟

全局安装Electron:

cnpm install -g electron

再安装一个傻瓜化的Electron工具包:

cnpm install -g electron-forge

这俩因为是全局安装,你可以在任何一个地方运行。

基本上,比较小的开发项目也就用得到这俩开发包。

然后,找一个你认为好的文件夹,打开cmd一路cd进去。

这里我的Electron项目在E:electron1,你可以自己换一个目录/名称,建议使用二级目录,在根目录下建一个文件夹,做Electron的存放位置,再在它下建一个文件夹,做项目的存放地。

然后,进入你的项目目录,如果你跟我一样的话,就要cd进E:electron1,再运行:

git clone https://github.com.cnpmjs.org/electron/electron-quick-start 

事实上,应该是

electron-forge init

,但是这样太慢了,我等了整整半个小时,一个提示都没出来,而我用git clone 时,那个百分比那叫一个飞啊,一秒跑完,这还是在我的网不怎么好的情况下。

然后,运行完那个clone的命令后,运行:

cnpm install

你试试,是不是很快?

基本是一秒跑完。

然后,你的app文件夹就算完成了。

输入运行命令:

electron .

为了确保依赖包均已安装,我们再这样运行一下:

npm start

这个不涉及网络,可以使用npm进行。

如果两个都成功运行,我们就可以进行下一步了。

如果npm执行失败,你需要重新运行cnpm install,如果electron . 执行失败,你需要重新运行cnpm install electron。

然后,你需要在package.json里改成这样的:

{
  "name": "electron-quick-start",
  "version": "1.0.0",
  "description": "A minimal Electron application",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "make": "electron-forge make"
  },
  "repository": "https://github.com/electron/electron-quick-start",
  "keywords": [
    "Electron",
    "quick",
    "start",
    "tutorial",
    "demo"
  ],
  "author": "GitHub",
  "license": "CC0-1.0",
  "devDependencies": {
    "electron": "^11.2.1"
  }
}


直接C/V就行了。

然后,可以编译了。

继续运行:

cnpm run make

或者是:

cnpm run-script make

再或者是:

electron-forge make

事实上这三个运行的结果是一样的……

都是调用

electron-forge

然后,在你的项目文件夹下会出现一个out文件夹,点开,就会看见exe可执行文件啦!

然后,运用我们整治NW的方法:ResHacker,就ok啦。

原创文章,作者:AxiomXS,如若转载,请注明出处:https://www.axiomxs.com/axiom/311.html
-- 展开阅读全文 --
他不会愧疚,甚至都不会想起你
« 上一篇 02-20
有关于Typora的Night主题改进
下一篇 » 02-28

发表评论

V注册会员 L评论等级
R5 条回复
  1. AdkinsmVLv.3 说道:
    2021-02-28     Win 10 /    Chrome

    node没安装cnpm的童鞋记得安装cnpm和淘宝源啊!

    1. AdkinsmVLv.3 说道:
      2021-02-28     Win 10 /    Chrome

      @Adkinsm

      淘宝源与cnpm安装详见 https://www.adkinsm.top/post/11.html

      1. AxiomXSVLv.3 说道:
        2021-03-02     Win 10 /    FireFox

        @Adkinsm

        哈哈哈嗝,感谢大佬回复

        1. AdkinsmVLv.3 说道:
          2021-03-03     Android /    Chrome

          @AxiomXS

          引一波流

          1. AxiomXSVLv.3 说道:
            2021-03-14     Win 10 /    FireFox

            @Adkinsm

            好家伙的

没有更多评论了

作者信息

Title - Artist
0:00