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

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

苏南大叔:electron 如何修改生成文件名称为中文? - electron-cn
electron 如何修改生成文件名称为中文?(图5-1)

本文测试环境:macelectron-builder/electron-packager

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

错误的修改方式示意

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

苏南大叔:electron 如何修改生成文件名称为中文? - package-name-error
electron 如何修改生成文件名称为中文?(图5-2)

解决方案

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

方案一(electron-builder)

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

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

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

苏南大叔:electron 如何修改生成文件名称为中文? - name-cn-builder
electron 如何修改生成文件名称为中文?(图5-3)

方案二(electron-packager)

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

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

苏南大叔:electron 如何修改生成文件名称为中文? - packager-name-cn
electron 如何修改生成文件名称为中文?(图5-4)

特别说明

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

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

苏南大叔:electron 如何修改生成文件名称为中文? - path-name-diy
electron 如何修改生成文件名称为中文?(图5-5)

相关链接

总结

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

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

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

 【福利】 腾讯云最新爆款活动!1核2G云服务器首年50元!

 【源码】本文代码片段及相关软件,请点此获取更多信息

 【绝密】秘籍文章入口,仅传授于有缘之人   electron