electron-builder自动修改应用名称和默认安装位置

electron-builder自动修改应用名称和默认安装位置

先说下做了什么事吧，就是在打包的脚本里先通过cross-env设置几个不同的环境变量，然后在执行electron-builder之前根据模板字符串重新生成打包相关的配置文件。目的是为了打包不同的接口和环境的时候可以自动生成相应的快捷方式名称和默认安装位置，不然的话每次打包还要修改配置文件，当然你说安装位置可以自己去选择，但是我们更期望的是足够简单，直接点下一步就行了。

###1.通过cross-env设置不同的环境
当然先要安装这个模块了，执行npm install --save-dev cross-env即可。它的作用是可以添加一些自定义的环境变量，但是这个变量只是在打包的时候使用，如果你在渲染的模块里调用就没有这个变量了。例如我在package.json里定义了API这个变量：

{
  "name": "xxxx",
  ...
  "scripts": {
    "build": "cross-env API=production node .electron-vue/build.js && electron-builder",
    "build:test": "cross-env API=test node .electron-vue/build.js && electron-builder"
  },
  "dependencies": {
    ...
  },
  "devDependencies": {
    "cross-env": "^5.1.6",
    ...
  }
}

2.根据模板字符串生成配置文件

2.1定义electron-buidler配置的模板字符串

electron-builder的配置除了定义在package.json里还可以单独拎出来作为一个文件，名字是electron-builder.json。我是定义在一个js模块里的template-builder，代码如下：

module.exports = {
    template: "{\n" +
        "  \"productName\": \"$productName\",\n" +
        "  \"appId\": \"$appId\",\n" +
        "  \"directories\": {\n" +
        "    \"output\": \"build\"\n" +
        "  },\n" +
        "  \"files\": [\n" +
        "    \"dist/electron/**/*\"\n" +
        "  ],\n" +
        "  \"dmg\": {\n" +
        "  },\n" +
        "  \"win\": {\n" +
        "    \"icon\": \"build/icons/win.ico\",\n" +
        "    \"target\": \"nsis\"\n" +
        "  },\n" +
        "  \"nsis\": {\n" +
        "  },\n" +
        "  \"artifactName\": \"${productName}_Setup_${version}.${ext}\",\n" +
        "  \"linux\": {\n" +
        "  }\n" +
        "}\n"
}

这里定义了两个要替换的字符串$productName和$appId，通过替换这两个字符串会生成一个新的字符串，直接把这个新的字符串写到项目根目录的electron-builder.json里

<