Blockly图形化编程语言转exe桌面应用程序

Blockly是一种易于使用的图形化编程语言，它允许用户通过拖放块的方式来创建应用程序。要把它转换为可执行的exe文件，您可以遵循以下步骤：
1. 将Blockly项目中的所有文件打包成单个文件夹。 2. 使用代码生成器将Blockly文件转换为exe文件。 3. 生成的可执行文件将可以在任何计算机上运行，无需安装任何依赖项。
在开发过程中，您可以使用任何文本编辑器来编辑代码，并使用任何操作系统上的任何计算机来运行exe文件。请注意，生成的exe文件可能包含一些不必要的信息，例如版权声明和版本号，您能够依据需要进行清理和修改。
总的来说，使用Blockly开发exe文件是一种简单而有效的方法，可以轻松地将您的应用程序发布到其他计算机上。

Blockly 是一个基于浏览器的可视化编程工具，为使用者提供一种拖拽式的代码构建方法。通过将代码块组合在一起，用户可以创建应用程序而无需直接编写代码。可是，Blockly 默认只支持在网页环境中工作，不能直接生成可执行文件（exe）。但有一种有效的方法，通过将 Blockly 项目与 Electron 结合，可以生成一个运行在桌面环境的应用程序的，包括 Windows (.exe)。

在这个教程中，我将向你展示如何将 Blockly 项目与 Electron 集成在一起开发 exe。

**步骤一准备 Blockly 项目**

1. 首先需要搭建一个基于 Blockly 的网页面板用于制作界面和交流程序。可以访问 Blockly 官网创建一个简单的项目。

 

参考文档[https://developers.google.com/blockly/guides/get-started/web](https://developers.google.com/blockly/guides/get-started/web)

2. 在你的项目文件夹中创建一个名为 `blockly-project` 的新文件夹，并在其中存放 Blockly 相关的文件（如 index.html、JavaScript 文件等）。

**步骤二创建 Electron 项目**

1. 首先在你的计算机上安装 Node.js。你可以在这里下载它[https://nodejs.org/](https://nodejs.org/)

2. 使用命令行导航到包含 `blockly-project` 文件夹的文件夹中，然后运行以下命令以创建一个新的 Electron 项目

```

npm init

```

系统将提示你输入一些项目信息。在完成后，你将得到一个名为 `package.json` 的文件。

3. 安装 Electron 依赖项

```

npm install electron --save-dev

```

4. 在根项目文件夹中创建一个名为 `main.js` 的新文件，以便开始开发 Electron 应用程序。主要文件 `main.js` 应包含以下代码

```javascript

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

function createWindow () {

// 创建浏览器窗口

const win = new BrowserWindow({

width: 800,

height: 600,

webPreferences: {

nodeIntegration: true

}

})

// 加载 blockly-project 网页

win.loadFile('blockly-project/index.html')

}

// 当 Electron 结束初始化后调用该方法

app.whenReady().then(createWindow)

// 当所有窗口都被关闭后退出应用程序

app.on('window-all-closed', () => {

if (process.platform !== 'darwin') {

app.quit()

}

})

app.on('activate', () => {

if (BrowserWindow.getAllWindows().length === 0) {

createWindow()

}

})

```

5. 修改 `package.json` 文件的 `scripts` 字段，将 `test` 更改为 `start`，并将 `echo \Error: no test specified\ && exit 1` 更改为 `electron .`，如下所示

```json

scripts: {

start: electron .

},

```

**步骤三运行并导出项目**

1. 在项目的根文件夹中打开命令行界面，然后运行以下命令以启动你的 Electron 应用程序

```

npm start

```

2. 键入应用程序中直接生成 EXE 文件。首先，安装 electron-packager

```

npm install electron-packager -g

```

3. 然后，在项目的根目录运行以下命令以生成可执行文件

```

electron-packager . --platform=win32 --arch=x64

```

如果一切顺利，你将看到生成的 EXE 文件及相关的依赖项文件。

至此，你已成功创建并导出一个基于 Blockly 的 Electron 应用程序。现在你可以将此应用程序分发给其他计算机以供他们使用。