記一次使用Node.js electron打包網站的記錄

来源:http://www.cnblogs.com/yayazi/archive/2017/12/01/7943100.html
-Advertisement-
Play Games

具體步驟請參考:http://blog.csdn.net/a727911438/article/details/70834467 打包時出現了不少問題,逐一記錄下來以供其他人參考。 package.json文件內容 main.js文件內容 安裝好打包神器後,在執行 electron-packager ...


具體步驟請參考:http://blog.csdn.net/a727911438/article/details/70834467

打包時出現了不少問題,逐一記錄下來以供其他人參考。

package.json文件內容

{
  "name": "appname",
  "version": "0.1.0",
  "main": "./main.js",
  "scripts": {
    "start": "electron ."
  }
}

main.js文件內容

const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')

// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let win

function createWindow () {
  // Create the browser window.
  win = new BrowserWindow({width: 800, height: 600})

  // and load the index.html of the app.
  win.loadURL(url.format({
    pathname: path.join(__dirname, 'index.html'),
    protocol: 'file:',
    slashes: true
  }))

  // Open the DevTools.
  // win.webContents.openDevTools()

  // Emitted when the window is closed.
  win.on('closed', () => {
    // Dereference the window object, usually you would store windows
    // in an array if your app supports multi windows, this is the time
    // when you should delete the corresponding element.
    win = null
  })
}

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', () => {
  // On macOS it is common for applications and their menu bar
  // to stay active until the user quits explicitly with Cmd + Q
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  // On macOS it's common to re-create a window in the app when the
  // dock icon is clicked and there are no other windows open.
  if (win === null) {
    createWindow()
  }
})

// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

安裝好打包神器後,在執行 electron-packager時出現“Unable to determine Electron version. Please specify an Electron version”錯誤:

要解決這一問題,只需在命令中指定Electron version,具體命令如下:

electron-packager . sound_machine --win --out a --arch=
x64 --version=0.1.0 --electron-version=1.6.15 --overwrite --ignore=node_modules

 由於本地網路採用的是伺服器代理上網模式,因此還需為npm指定代理地址,否則會出現“tunneling socket could not be established, statusCode=502”的錯誤。

 

設置npm代理的命令如下:

npm config set proxy=http://10.**.**.**:8080

 再次執行 electron-packager打包命令,這次沒有錯誤了,提示開始下載文件。下載完成後開始打包,提示打包成功:

至此,打包完成。

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 詳述JavaScript的官方模塊風格。加入這一定義旨在代替過去幾年中出現過的許多非正式的模塊定義風格。 ...
  • 介紹正式加入 JavaScript 的反射 API 和新的代理對象,開發者可以通過代理對象攔截每一個對象中執行的操作,代理也賦予了開發者空前的對象控制權,同樣也為定義新的交互模式帶來無限可能。 ...
  • CodePen 需要使用色 ec6337(當然可以是任意顏色),解決問題:記住密碼定製 CheckBox,解釋全在註釋里 主要使用到 ::before 或 ::after 偽類處理,偽裝成內部的那個勾 html CSS(LESS) CodePen ...
  • 很多人對正則表達式的印象都是用來做表單驗證的,這其實是不大準確的。正則表達式目前在很多軟體中都得到了廣泛的應用,包括Linux,Unix等操作系統,VBScript,Java,PHP等開發環境中,以及很多應用軟體都能應用到正則表達式。 ...
  • cu主題是由瘋狂的大叔設計,界面簡潔大方是它最大的特點之一。 手殘君也比較喜愛這款主題,在使用的過程中,根據手殘君的個人習慣,對其進行了優化。 標題居中顯示 增加標題div背景色 標題div平滑優化 相關代碼: tags頁面增加標簽彙總(隨著標簽越來越多,原有的tags頁面滿足不了數據索引的需求) ...
  • 公司突然組織需要重新搭建一個基於 的論壇系統,前端採用 ,上網找了一些腳手架,或多或少不能滿足自己的需求,最終在基於 的`react`腳手架 "generator react webpack" 上搭建改造,這裡作為記錄。 代碼在這裡: "github" 另外推薦地址: "react starter ...
  • 圖片隱寫術就是利用圖片來隱藏某些數據,讓人一眼看去以為是很普通很正常的圖片,但其實裡面隱藏著某些“機密”數據。我們可以用它來保護某些機密圖片或者隱藏特殊的文字信息。 ...
  • Angular2官網通過http請求模擬API 來請求hero 數據,感覺有點繁瑣,很讓人理解不了,我們不採用它的辦法,直接展示怎麼使用http請求來獲取我們的數據 ,直截了當。 第一、準備工作,創建一個WebApi 創建一個webapi(這裡我使用MVC4 WebApi ,你可以選擇其他途徑提供j ...
一周排行
    -Advertisement-
    Play Games
  • 前言 本文介紹一款使用 C# 與 WPF 開發的音頻播放器,其界面簡潔大方,操作體驗流暢。該播放器支持多種音頻格式(如 MP4、WMA、OGG、FLAC 等),並具備標記、實時歌詞顯示等功能。 另外,還支持換膚及多語言(中英文)切換。核心音頻處理採用 FFmpeg 組件,獲得了廣泛認可,目前 Git ...
  • OAuth2.0授權驗證-gitee授權碼模式 本文主要介紹如何筆者自己是如何使用gitee提供的OAuth2.0協議完成授權驗證並登錄到自己的系統,完整模式如圖 1、創建應用 打開gitee個人中心->第三方應用->創建應用 創建應用後在我的應用界面,查看已創建應用的Client ID和Clien ...
  • 解決了這個問題:《winForm下,fastReport.net 從.net framework 升級到.net5遇到的錯誤“Operation is not supported on this platform.”》 本文內容轉載自:https://www.fcnsoft.com/Home/Sho ...
  • 國內文章 WPF 從裸 Win 32 的 WM_Pointer 消息獲取觸摸點繪製筆跡 https://www.cnblogs.com/lindexi/p/18390983 本文將告訴大家如何在 WPF 裡面,接收裸 Win 32 的 WM_Pointer 消息,從消息裡面獲取觸摸點信息,使用觸摸點 ...
  • 前言 給大家推薦一個專為新零售快消行業打造了一套高效的進銷存管理系統。 系統不僅具備強大的庫存管理功能,還集成了高性能的輕量級 POS 解決方案,確保頁面載入速度極快,提供良好的用戶體驗。 項目介紹 Dorisoy.POS 是一款基於 .NET 7 和 Angular 4 開發的新零售快消進銷存管理 ...
  • ABP CLI常用的代碼分享 一、確保環境配置正確 安裝.NET CLI: ABP CLI是基於.NET Core或.NET 5/6/7等更高版本構建的,因此首先需要在你的開發環境中安裝.NET CLI。這可以通過訪問Microsoft官網下載並安裝相應版本的.NET SDK來實現。 安裝ABP ...
  • 問題 問題是這樣的:第三方的webapi,需要先調用登陸介面獲取Cookie,訪問其它介面時攜帶Cookie信息。 但使用HttpClient類調用登陸介面,返回的Headers中沒有找到Cookie信息。 分析 首先,使用Postman測試該登陸介面,正常返回Cookie信息,說明是HttpCli ...
  • 國內文章 關於.NET在中國為什麼工資低的分析 https://www.cnblogs.com/thinkingmore/p/18406244 .NET在中國開發者的薪資偏低,主要因市場需求、技術棧選擇和企業文化等因素所致。歷史上,.NET曾因微軟的閉源策略發展受限,儘管後來推出了跨平臺的.NET ...
  • 在WPF開發應用中,動畫不僅可以引起用戶的註意與興趣,而且還使軟體更加便於使用。前面幾篇文章講解了畫筆(Brush),形狀(Shape),幾何圖形(Geometry),變換(Transform)等相關內容,今天繼續講解動畫相關內容和知識點,僅供學習分享使用,如有不足之處,還請指正。 ...
  • 什麼是委托? 委托可以說是把一個方法代入另一個方法執行,相當於指向函數的指針;事件就相當於保存委托的數組; 1.實例化委托的方式: 方式1:通過new創建實例: public delegate void ShowDelegate(); 或者 public delegate string ShowDe ...