SpringBoot+Vue项目打包成exe，含mysql，redis，nginx，Electron

将Spring Boot和Vue项目打包成一个EXE文件，涉及到多个组件的集成，如MySQL、Redis、Nginx和Electron。本文将详细介绍如何使用这些技术创建一个可执行文件，并提供相关的代码示例。

1. 项目结构

首先，我们需要一个基本的项目结构。我们将创建一个Spring Boot后端服务和一个Vue前端项目，同时使用Electron来将其打包成EXE格式。

my_project/
├── backend/        # Spring Boot项目
├── frontend/       # Vue项目
├── package.json     # Electron打包配置文件
├── main.js          # Electron主进程文件
└── resources/       # 其他资源（如MySQL、Redis配置）

2. Spring Boot后端服务

我们首先需要创建一个Spring Boot项目，假设后端服务的主要功能是提供API接口，供前端使用。

@RestController
@RequestMapping("/api")
public class UserController {

    @Autowired
    private UserService userService;

    @GetMapping("/users")
    public List<User> getAllUsers() {
        return userService.findAll();
    }
}

在application.properties文件中配置MySQL连接：

spring.datasource.url=jdbc:mysql://localhost:3306/mydb
spring.datasource.username=root
spring.datasource.password=yourpassword

3. Vue前端项目

接下来，创建一个简单的Vue应用，使用Axios来与后端API通信。

<template>
  <div>
    <h1>用户列表</h1>
    <ul>
      <li v-for="user in users" :key="user.id">{{ user.name }}</li>
    </ul>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      users: []
    };
  },
  mounted() {
    axios.get('http://localhost:8080/api/users')
      .then(response => {
        this.users = response.data;
      });
  }
};
</script>

4. Electron打包

我们使用Electron来将整个应用打包为一个EXE文件。首先，确保在package.json中添加了Electron配置。

{
  "name": "my-electron-app",
  "version": "1.0.0",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "build": "electron-builder"
  },
  "build": {
    "appId": "com.example.myapp",
    "win": {
      "target": "nsis"
    }
  },
  "dependencies": {
    "electron": "^latest"
  }
}

在main.js中，设置Electron窗口并加载前端应用：

const { app, BrowserWindow } = require('electron');
const path = require('path');

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  });

  win.loadURL('http://localhost:8080');
}

app.whenReady().then(createWindow);

5. 运行和打包

在开发完成后，我们需要启动后端和前端服务：

# 启动Spring Boot应用
cd backend
mvn spring-boot:run

# 启动Vue应用
cd frontend
npm run serve

然后，在另一个终端窗口中，运行Electron应用：

# 启动Electron
npm start

最后，使用以下命令打包：

npm run build

6. 集成MySQL和Redis

确保在打包时提供MySQL和Redis的可访问配置。在运行EXE文件时，可以创建一个简单的Shell脚本来启动MySQL和Redis服务，以确保它们在您的应用之前启动。

# start_services.sh
service mysql start
service redis-server start

在最终的EXE文件中，可以通过修改main.js来执行这个脚本。

总结

通过上述步骤，我们成功地将Spring Boot和Vue项目打包为一个包含MySQL、Redis、Nginx和Electron的EXE文件。这样，我们的应用就可以在没有复杂配置的情况下，直接在Windows上运行。希望这能为你后续的开发工作提供帮助。