js(原名 Node-Webkit)是一個基于 Chromium 和 Node.js 的應用運行時環境,它允許你使用 HTML5、CSS、JavaScript、Node.js 和 WebGL 等 Web 技術開發本地應用。

利用 NW.js,可以將 H5 網頁打包成 Windows、Mac 或者 Linux 平臺上的獨立可執行文件(EXE、APP 或者 Elf 格式),讓用戶無需安裝任何瀏覽器或插件就可以直接運行應用。

2. 安裝及使用教程

(1)下載并安裝 Node.js,官網地址:https://nodejs.org/en/download/ 。

(2)打開命令提示符或終端,運行以下命令安裝 NW.js:

“`shell

npm install -g nw

“`

(3)準備你的 H5 項目,假設項目文件夾為 my_h5_project,需要在其中創建一個名為 package.json 的文件,內容如下:

“`json

{

“name”: “my_h5_project”,

“version”: “1.0.0”,

“main”: “index.html”,

“window”: {

“title”: “My H5 EXE App”

}

}

“`

(4)打開命令提示符或終端,進入項目文件夾 my_h5_project,運行以下命令啟動應用:

“`shell

nw .

“`

(5)將 H5 網頁打包成 EXE,可以使用如下命令(需在項目根目錄下運行,會在 dist 文件夾下生成 EXE 文件):

“`Shell

npm install -g nw-builder

nwbuild -v 0.49.0-sdk -p win64 . –output-dist ./dist

“`

三、Electron

1. 原理

Electron 是一個基于 Chromium 和 Node.js 的跨平臺桌面應用開發框架。它使得開發者可以使用 Web 技術來構建桌面應用。通過 Electron,你可以將 H5 網頁打包成 Windows、Mac 或者 Linux 平臺上的可執行文件(EXE、APP 或者 Elf 格式)。

2. 安裝及使用教程

(1)下載并安裝 Node.js,官網地址:https://nodejs.org/en/download/ 。

(2)打開命令提示符或終端,運行以下命令安裝 Electron:

“`shell

npm install -g electron

“`

(3)準備你的 H5 項目,假設項目文件夾為 my_h5_project,需要在其中創建一個名為main.js 的文件,內容如下:

“`javascript

網站轉exe工具

const { app, BrowserWindow } = require(“electron”);

function createWindow() {

const win = new BrowserWindow({

width: 800,

height: 600,

webPreferences: {

nodeIntegration: true

}

});

win.loadFile(“index.html”);

}

app.whenReady().then(createWindow);

app.on(“window-all-closed”, () => {

if (process.platform !== “darwin”) {

app.quit();

}

});

app.on(“activate”, () => {

if (BrowserWindow.getAllWindows().length === 0) {

createWindow();

}

});

“`

(4)在項目根目錄下創建一個 package.json 文件,內容如下:

“`json

{

“name”: “my_h5_project”,

“version”: “1.0.0”,

“main”: “main.js”,

“scripts”: {

“start”: “electron .”

}

}

“`

(5)打開命令提示符或終端,進入項目文件夾 my_h5_project,輸入以下命令啟動應用:

“`shell

npm start

“`

(6)將 H5 網頁打包成 EXE,可以使用如下命令(需在項目根目錄下運行,會在 dist 文件夾下生成 EXE 文件):

“`Shell

npm install –save-dev electron-packager

npx electron-packager . my-h5-exe –platform=win32 –arch=x64 –overwrite

“`

這樣,你就可以使用 NW.js 或 Electron 將 H5 網頁打包成 Windows 平臺上的可執行文件(EXE)了。同樣的方法可以將其打包成 Mac 和 Linux 平臺的可執行文件。

未經允許不得轉載:智電網絡 NET » h5打包exe工具常用推薦

相關推薦