Best Practices for Sharing Code Between Cocos Creator 3 Projects

Best Practices for Sharing Code Between Cocos Creator Projects

Hello fellow developers,

I’m currently exploring efficient ways to share reusable code across different projects in Cocos Creator and would appreciate your insights on two methods I’m considering: Git submodules and NPM packages. Here’s my understanding and concerns for each:

1. Git Submodules

  • Pros:
    • Allows for debugging the entire codebase as it’s not precompiled; integrates directly with the project.
    • Easy to track different versions and branches of the shared code, enabling specific version control per project.
    • Simplifies the management of dependencies since they are directly included in your project repository.
  • Cons:
    • Potential issues with UUID collisions; code is not precompiled, which may impact performance or lead to other integration complexities.
    • Can make the repository clunky if the submodule is large or contains many files.
    • Requires understanding of Git submodules handling, which can complicate source control operations for teams unfamiliar with it.
  • Configuration Options:
    • Using submodules in an extensions folder requires more effort from the developer to compile the project.
    • Alternatively, placing submodules in different project folders simplifies access but might lead to less clear project organization.
    • Each configuration has its own pros and cons, influencing how much manual setup and maintenance is required.

2. NPM Packages

  • Pros:
    • Facilitates writing tests and possibly cleaner project separation.
    • Allows for modular code management and versioning through NPM, which can be updated and maintained separately from the main project.
    • Dependencies are managed and updated via NPM, which can ensure up-to-date libraries and modules.
  • Cons:
    • Cocos Creator does not generate meta files for node_modules, so it seems we can’t add resources or components directly in these packages.
    • While I can extend cc.Component in my project, I face issues when trying to debug as I can’t step into the module’s code.
    • Some build systems might require additional configuration to correctly bundle or exclude NPM dependencies, potentially complicating deployment.
    • After many hours, I was successfully able to compile an NPM package that referenced Cocos Creator code, but I had to extract and modify definitions to make it work.

Has anyone else faced similar challenges? How did you manage to integrate shared code effectively? Are there any pitfalls or tips you can recommend regarding either method, or perhaps another approach entirely?

I’m looking forward to learning from your experiences!

Two approaches from my pov:

  1. just copy/paste module folder directly into assets, with some custom-macros to handle different version
  2. Create your own Extension
    I prefer this two approaches as my target platform is mostly Android/iOS