electron 如何修改生成文件名称为中文？

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

可以说，本文的话题，又是electron开发中的一个常见谜题之一。那就是，如何修改生成文件名为中文。当然，涉及到很多地方的英文名字换成中文名字。最终生成的文件名是和package.json里面的name一致的，但是修改package.json里面的name为中文的时候，是直接报错的。那么，electron中，“修改文件名为中文”这个世纪难题，又该如何解决呢？

本文测试环境：mac，electron-builder/electron-packager。

注意：本文的方案都是要求，构建成成品后，才可以看到期望的效果。请不要在没有build之前，就跳出来说没有效果。简单地来说，在没有生成最终的app/exe之前的步骤中，您可能看不到期待的效果。

错误的修改方式示意

大部分的开发者，都会选择修改package.json中的name为中文。但是，马上就会发现碰壁，并不是想象中的那么简单。修改之后，您可能会碰到下面的错误提示Invalid name。

解决方案

因为正确的方案并不仅仅是一种，仅仅是因为，这个修改名字的过程，发生在打包过程中。而大家都知道：打包的方式有很多，所以，本文提及的方案，也只能是解决方案中的某一种或几种方案罢了。

方案一（electron-builder）

下面演示的是：electron-builder的修改方式。

路径是：package.json中的build节点中的productName。修改完之后，注意还需要再次打包才可以看到效果。
package.json：

{
  "name": "name_default",
  "build": {
    "productName": "修改后的中文名",
    //...
  }
  //...
}

方案二（electron-packager）

下面演示的是：electron-packager的修改方式，也是package.json中的productName。和electron-builder中，略有不同。

{
  "name": "packager",
  "productName": "中文名称",
  //... 
}

特别说明

对于在使用inno或者nsis生成的安装包，执行安装脚本的时候，安装路径中的最后一层目录，并不能通过本文的方式修改。具体安装到哪个目录，这个是安装脚本里面写好的逻辑。一般来说，取得是package.json里面的name。

拿nsis来说，就是installDir或者说是$instDir这个变量。不同的安装脚本对这个变量的处理可是不一样的，所以，具体问题具体分析吧。如果想改，就去找.nsh或者.nsi脚本逻辑。

相关链接

• https://newsn.net/say/electron-packager-command.html
• https://newsn.net/say/electron-vue-build-command.html
• https://newsn.net/say/electron-builder-install-directory.html

总结

本文的范例基于electron-vue，如果是基于其他的脚手架，也许有其他的修改方案。这里并不是唯一的标准答案。所以，请大家仔细想想，自己的问题是否适合于本篇文章的内容。

最后给出一个链接，您的electron的疑问，也许在下面的链接中有答案：

• https://newsn.net/tag/electron/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。