vue项目怎么打包成可执行文件

Vue项目可以通过以下步骤打包为可执行文件：

1. 安装electron：使用npm安装electron，命令如下：

npm install electron --save-dev

2. 在Vue项目根目录下创建main.js文件：该文件是electron的入口文件，内容如下：

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

function createWindow () {
  // 创建浏览器窗口
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  // 加载Vue项目
  win.loadFile('index.html')
}

app.whenReady().then(() => {
  createWindow()

  app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) {
      createWindow()
    }
  })
})

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

3. 修改package.json文件：修改Vue项目的打包命令，添加electron的启动命令，如下：

"scripts": {
  "build": "vue-cli-service build",
  "electron": "electron ."
}

4. 打包项目：使用Vue CLI打包Vue项目，命令如下：

npm run build

5. 启动electron：使用electron启动打包好的项目，命令如下：

npm run electron

6. 打包成可执行文件：使用electron-builder打包成可执行文件，命令如下：

npm install electron-builder --save-dev

在package.json文件中添加以下配置：

"build": {
  "appId": "com.example.app",
  "productName": "MyApp",
  "directories": {
    "output": "dist_electron"
  },
  "files": [
    "dist/**/*",
    "main.js",
    "package.json"
  ],
  "mac": {
    "category": "public.app-category.utilities"
  },
  "win": {
    "target": "nsis",
    "icon": "build/icon.ico"
  },
  "linux": {
    "target": [
      "AppImage",
      "deb"
    ],
    "icon": "build/icon.png"
  }
}

其中，appId是应用程序的唯一标识符，productName是应用程序的名称，directories.output指定输出目录，files指定需要打包的文件，mac和win是针对不同操作系统的配置，可以根据需要进行修改。

最后，执行以下命令进行打包：

npm run build
npm run electron-builder

打包完成后，在dist_electron目录下可以找到打包好的可执行文件。