cocos creator 使用 protobuf 的步骤与注意事项

1. 移除可能曾安装过的protobuf

// 移除全局
npm remove -g protobufjs
npm remove -g protobufjs-cli
npm remove -g pbjs
// 移除项目中的
npm remove --save protobufjs
npm remove --save protobufjs-cli
npm remove --save pbjs

2. 全局安装

npm i -g protobufjs//或者cnpm i -g protobufjs
npm install -g protobufjs//或者cnpm install -g protobufjs
npm i --g protobufjs-cli/或者cnpm i --g protobufjs-cli

//如果需要保存至项目，添加save将会自动写入到package.json中
npm i --save protobufjs protobufjs-cli
npm i --save protobufjs
npm i --save protobufjs-cli

3. 创建一个简单的proto测试文件（这里取名player.proto）

syntax = "proto3";
message PlayerInfo {
    int32 userId = 1;
    string userName = 3;
}

4. 生成js和.d.ts文件

pbjs： proto文件转换成js文件的命令

pbts： js文件转换成.d.ts文件的命令

-t static-module： 指定输出的模块类型为静态模块

-w commonjs： 指定生成的代码符合 CommonJS 模块规范，使其可以在 Node.js 等环境中使用。

-o {WritePath/WriteFile.js} {ReadPath/ReadFile.proto]： 将指定的proto文件进行转换并指定输出的文件名和路径。

pbjs -t static-module -w commonjs -o ./player.js ./player.proto
pbts -o ./player.d.ts ./player.js

也可以将所有proto文件合并生成到一个js和ts文件下

#将所有proto合并到一个整体的proto.js文件
pbjs -t static-module -w commonjs -o ./proto.js *.proto
pbts -o ./proto.d.ts ./proto.js

5. 导入的时候可能出现模块找不到的问题

解决方案：输入自己的路径导入，使用类似命名空间的方式使用（示例：PlayerInfo类型写法proto.PlayerInfo）

import {default as proto} from "./proto.js"