前排提示

• 这里第一次接触打包项目到可执行程序
• 由于技术不咋样, 所以感觉收货颇多的, 就简单记录一下

nwjs

这是用来把项目打成本地可执行的exe文件的.

下载, 分两个版本, 一个是normal版, 一个是SDK版, SDK是带chrome调试器的, 方便调试使用, normal版等正式发布应用的时候再用, 所以建议两个都下载下来.

文档, 关于文档没什么好说的, 翻开查阅即可.

inno setup

这是用来把本地可执行exe文件连同nwjs一起打成安装包的.

下载, 下载后自行安装即可, 没什么需要注意的.

步骤

打包vue项目

npm run build

nwjs

1. 新建 package.json 文件

具体配置项按需增加: 配置

关于 start.js 和 bgScript.js 是可选的脚本, 会在启动时和后台运行时调用, 按需求增加.

{ 
	"name": "你的应用名称",
	"main": "index.html",
	"nodejs": true,
	"node-main": "start.js",
	"bg-script": "bgScript.js",
	"window": {
		"title": "窗口标题",
		"toolbar": false,
		"position": "center",
		"fullscreen": true
	}
}

2. 合成文件

将新建的 package.json 文件和vue打包后的文件合并在一起, 就是把 package.json 文件放进dist目录下, 打包成一个zip文件, 然后重命名为dist.nw

3. 打成exe

在nw目录下, 使用以下命令即可

copy /b nw.exe+dist.nw result.exe

Inno Setup

1. 新建打包配置文件: xxx.iss

需要自定义修改的配置

#define MyAppName "应用名称"
#define MyAppVersion "1.5"
#define MyAppURL "https://www.example.com/"

; 这里对应的是打包后输出目录
OutputDir=E:\nw\dev-out
; 这里对应的是打包后输出名称
OutputBaseFilename=mysetupApp

; 这里对应的是你的nwjs目录
Source: "E:\nwjs-sdk-v0.83.0-win-x64\{#MyAppExeName}"; DestDir: "{app}"; Flags: ignoreversion
Source: "E:\nwjs-sdk-v0.83.0-win-x64\*"; DestDir: "{app}"; Flags: ignoreversion recursesubdirs createallsubdirs

完整配置

; Script generated by the Inno Setup Script Wizard.
; SEE THE DOCUMENTATION FOR DETAILS ON CREATING INNO SETUP SCRIPT FILES!

#define MyAppName "应用名称"
#define MyAppVersion "1.5"
#define MyAppPublisher "My Company, Inc."
#define MyAppURL "https://www.example.com/"
#define MyAppExeName "result.exe"
#define MyAppAssocName MyAppName + " File"
#define MyAppAssocExt ".myp"
#define MyAppAssocKey StringChange(MyAppAssocName, " ", "") + MyAppAssocExt
      
[Setup]
; NOTE: The value of AppId uniquely identifies this application. Do not use the same AppId value in installers for other applications.
; (To generate a new GUID, click Tools | Generate GUID inside the IDE.)
AppId={{642D6F8C-D396-432C-BA64-ED9E57CF56DB}
AppName={#MyAppName}
AppVersion={#MyAppVersion}
;AppVerName={#MyAppName} {#MyAppVersion}
AppPublisher={#MyAppPublisher}
AppPublisherURL={#MyAppURL}
AppSupportURL={#MyAppURL}
AppUpdatesURL={#MyAppURL}
DefaultDirName={autopf}\{#MyAppName}
ChangesAssociations=yes
DisableProgramGroupPage=yes
; Uncomment the following line to run in non administrative install mode (install for current user only.)
;PrivilegesRequired=lowest
OutputDir=E:\nw\dev-out
OutputBaseFilename=mysetupApp
Compression=lzma
SolidCompression=yes
WizardStyle=modern

[Languages]
Name: "english"; MessagesFile: "compiler:Default.isl"

[Tasks]
Name: "desktopicon"; Description: "{cm:CreateDesktopIcon}"; GroupDescription: "{cm:AdditionalIcons}"; Flags: unchecked

[Files]
Source: "E:\nwjs-sdk-v0.83.0-win-x64\{#MyAppExeName}"; DestDir: "{app}"; Flags: ignoreversion
Source: "E:\nwjs-sdk-v0.83.0-win-x64\*"; DestDir: "{app}"; Flags: ignoreversion recursesubdirs createallsubdirs
; NOTE: Don't use "Flags: ignoreversion" on any shared system files

[Registry]
Root: HKA; Subkey: "Software\Classes\{#MyAppAssocExt}\OpenWithProgids"; ValueType: string; ValueName: "{#MyAppAssocKey}"; ValueData: ""; Flags: uninsdeletevalue
Root: HKA; Subkey: "Software\Classes\{#MyAppAssocKey}"; ValueType: string; ValueName: ""; ValueData: "{#MyAppAssocName}"; Flags: uninsdeletekey
Root: HKA; Subkey: "Software\Classes\{#MyAppAssocKey}\DefaultIcon"; ValueType: string; ValueName: ""; ValueData: "{app}\{#MyAppExeName},0"
Root: HKA; Subkey: "Software\Classes\{#MyAppAssocKey}\shell\open\command"; ValueType: string; ValueName: ""; ValueData: """{app}\{#MyAppExeName}"" ""%1"""
Root: HKA; Subkey: "Software\Classes\Applications\{#MyAppExeName}\SupportedTypes"; ValueType: string; ValueName: ".myp"; ValueData: ""

[Icons]
Name: "{autoprograms}\{#MyAppName}"; Filename: "{app}\{#MyAppExeName}"
Name: "{autodesktop}\{#MyAppName}"; Filename: "{app}\{#MyAppExeName}"; Tasks: desktopicon

[Run]
Filename: "{app}\{#MyAppExeName}"; Description: "{cm:LaunchProgram,{#StringChange(MyAppName, '&', '&&')}}"; Flags: nowait postinstall skipifsilent

2. 执行打包命令打包

SET innoPath="Inno Setup安装路径\ISCC.exe"
SET issPath="iss文件路径\dev.iss"

%innoPath% %issPath%

执行完后安装即可