ac”: {

“category”: “public.app-category.utilities”

},

“win”: {

“target”: “nsis”

}

}

}

“`

這個配置將告訴 electron-builder 如何打包我們的應用程序。其中,appId 和 productName 是應用程序的標識和名稱,directories.output自己制作桌面的軟件 是打包后的輸出目錄,files 是要打包的文件列表,mac 和 win 是針對不同平臺的配置。

5. 執行以下命令打包應用程序:

“`

npm run build

“`

這個命令將編譯 Vue.js 應用程序,并使用 electron-builder 打包它。打包后的文件將位于 build 目錄中。

6. 在 build 目錄中找到可執行文件,雙擊運行即可。

二、使用 NW.js 打包 Vue.js 應用程序

NW.js (以前稱為 node-webkit) 是一個類似于 Electron 的框架,用于構建跨平臺桌面應用程序。它基于 Chromium 和 Node.js,并提供了許多原生 API,以便訪問操作系統的功能。我們可以使用 NW.js 打包我們的 Vue.js 應用程序,并將其轉換為可執行文件。

以下是使用 NW.js 打包 Vue.js 應用程序的步驟:

1. 創建一個新的 Vue.js 應用程序,并使用 vue-cli 初始化項目。

2. 安裝 NW.js 和 nw-builder。

“`

npm install nw nw-builder –save-dev

“`

3. 在項目根目錄中創建一個 package.json 文件,用于配置 NW.js。

“`json

{

“name”: “myapp”,

“version”: “1.0.0”,

“main”: “index.html”,

“window”: {

“toolbar”: false,

“frame”: true,

“width”: 800,

“height”: 600

}

}

“`

這個文件將定義應用程序的名稱、版本、入口文件和窗口配置。

4. 在 package.json 文件中添加以下配置:

“`json

{

“build”: {

“nwVersion”: “0.51.0”,

“platforms”: [

“win32”,

“win64”,

“osx64”,

“linux32”,

“linux64”

],

“appName”: “My App”,

“appVersion”: “1.0.0”,

“buildDir”: “build”,

“files”: [

“dist/**/*”,

“package.json”

]

}

}

“`

這個配置將告訴 nw-builder 如何打包我們的應用程序。其中,nwVersion 是 NW.js 的版本,platforms 是要打包的平臺列表,appName 和 appVersion 是應用程序的名稱和版本,buildDir 是打包后的輸出目錄,files 是要打包的文件列表。

5. 執行以下命令打包應用程序:

“`

npm run build

“`

這個命令將編譯 Vue.js 應用程序,并使用 nw-builder 打包它。打包后的文件將位于 build 目錄中。

6. 在 build 目錄

未經允許不得轉載:智電網絡 NET » vue路徑打包exe操作辦法介紹

相關推薦