# variable-generation-tool

**Repository Path**: zqylzcwcxy/variable-generation-tool

## Basic Information

- **Project Name**: variable-generation-tool
- **Description**: 🚀windows桌面端英文驼峰变量生成工具
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 30
- **Forks**: 5
- **Created**: 2021-09-29
- **Last Updated**: 2025-05-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Electron, vue3, TypeScript, composition-api

## README

### 2.0版本

https://github.com/zqy233/variable-generation-tool2


### 🎉介绍

根据中文生成英文驼峰变量名，减轻取复杂变量名时的痛



### :zap:功能

调用百度翻译api翻译中文，将返回结果拼接为驼峰字符串，从而作为英文变量名进行使用

实现自动复制，翻译后直接ctrl+v即可



### ✨样式
![image-20211217155017757](https://gitee.com/zqylzcwcxy/picture-bed/raw/master/img/image-20211217155017757.png)



### 🔖下载安装exe

点击右侧发行版

或直接至文件地址下载

https://gitee.com/zqylzcwcxy/variable-generation-tool/blob/master/variable-generation%20Setup%200.1.0.exe



### 📝electron打包本vue项目流程

如果你想要自行打包本项目

首先需要版本号大于14.0.0的较新的node版本

```bash
npm i
```

#### 📝1.添加打包工具

```bash
vue add electron-builder
```

#### 📝2.配置electron镜像地址

因为有些下载的文件访问的是国外地址，不配置镜像地址无法成功下载

```bash
npm config set registry http://registry.npm.taobao.org/
npm config set electron_mirror="https://npm.taobao.org/mirrors/electron/"
npm config set electron_builder_binaries_mirror="http://npm.taobao.org/mirrors/electron-builder-binaries/"
```

最好去C:\Users\Administrator下查看.npmrc文件中是否配置镜像成功

如果.npmrc文件中有proxy,https-proxy等配置,要删除,会影响文件下载



#### 📝3.项目中设置跨域proxy，需要去除，且页面中axios需要使用完全路径

打开vue.config.js文件

```js
module.exports = {
  // 开发环境时使用proxy,生产环境即electron打包需要注释掉proxy
  // 同时页面中axios使用完全路径
  // devServer: {
  //   proxy: {
  //     "/api": {
  //       target: "https://fanyi-api.baidu.com/api/trans/vip/translate",
  //       changeOrigin: true,
  //       rewrite: path => path.replace(/^\/api/, "")
  //     }
  //   }
  // }
}
```

#### 📝4.进行打包

```bash
npm run electron:build // 打包命令
```
有可能出现文件下载错误，可以自行下载相应文件放在以下路径中

```bash
C:\Users\Administrator\AppData\Local\electron-builder\Cache
```

打包成功后会在dist_electron中生成了exe文件，点击安装即可



#### 📝5.electron-builder打包后跨域访问失效问题的解决

1. 修改axios的请求地址为完整url地址

1. vue.config.js中不使用proxy

2. 在`electron`主启动类（目前是background.ts）中关闭web权限检查

   ```bash
   async function createWindow() {
     const win = new BrowserWindow({
       ...
       webPreferences: {
         ...
         //关闭web权限检查，允许跨域
         webSecurity: false
       }
     })
   }
   ```

#### 📝6.设置应用图标

需要256*256，格式为ico，注意，不能采用直接修改后缀名的方式，需要使用专门的网站转换

vue.config.js中设置

```js
module.exports = {
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        win: {
          icon: 'src/assets/logo.ico'
        }
      }
    }
  }
}
```