Makepad Project Packaging Guide
Requirements for packaging a Makepad project depend on the target platform. This guide provides an overview of how to package your Makepad application for different platforms, including desktop and mobile.
1. Desktop Packaging
Makepad does not provide an official desktop packaging tool, so we use the popular community tool cargo-packager to package your Makepad application.
Pre-packaging checklist
1. Installcargo-packager
1cargo install cargo-packager --locked
This tool helps you create packages for your Makepad application, including generating the necessary files and directories for different platforms.
2. Configurecargo-packager
You can configure cargo-packager in two ways:
- Add a
[package.metadata.packager] section in Cargo.toml that contains the metadata needed for packaging, including platform-specific settings (see the example below).
- Create a new
packager.toml file to specify other packaging options.
For more configurable parameters, see the cargo-packager documentation: https://docs.crabnebula.dev/packager/#configuration
This guide uses Cargo.toml for most app configuration as an example:
1[package.metadata.packager]
2product_name = "YourAppName"
3identifier = "com.yourcompany.yourapp"
4authors = ["Your Name or Team name"]
5description = "A brief description of your Makepad application"
6### Note: there is an 80-character max for each line of the `long_description`.
7long_description = "..."
8icons = ["./assets/icon.png"]
9out_dir = "./dist"
10# ... other packaging options, see the cargo-packager docs for more details.
11
12before-packaging-command = """
13robius-packaging-commands before-packaging \
14 --force-makepad \
15 --binary-name <main-binary-name> \
16 --path-to-binary ./target/release/<main-binary-name>
17"""
18
19# We need to specify the resources that will be included in the package; the packager copies them to the output directory.
20# Note: if you are using Makepad v1.0 or above, you need to specify more resource files:
21resources = [
22 ######### ⚠️ Makepad built-in resource files you also need to include #########
23 { src = "./dist/resources/makepad_widgets", target = "makepad_widgets" },
24 { src = "./dist/resources/makepad_fonts_chinese_bold", target = "makepad_fonts_chinese_bold" },
25 { src = "./dist/resources/makepad_fonts_chinese_bold_2", target = "makepad_fonts_chinese_bold_2" },
26 { src = "./dist/resources/makepad_fonts_chinese_regular", target = "makepad_fonts_chinese_regular" },
27 { src = "./dist/resources/makepad_fonts_chinese_regular_2", target = "makepad_fonts_chinese_regular_2" },
28 { src = "./dist/resources/makepad_fonts_emoji", target = "makepad_fonts_emoji" },
29
30 ######### ⚠️ Your own project resource files #########
31 { src = "./dist/resources/you_app_resource", target = "you_app_resource" },
32]
33
34before-each-package-command = """
35robius-packaging-commands before-each-package \
36 --force-makepad \
37 --binary-name <main-binary-name> \
38 --path-to-binary ./target/release/<main-binary-name> \
39"""
We use a small robius-packaging-commands CLI tool to run packaging commands before packaging your Makepad application.
You can install the robius-packaging-commands tool with:
1cargo install --version 0.2.0 --locked --git https://github.com/project-robius/robius-packaging-commands.git robius-packaging-commands
Note that the version of the robius-packaging-commands tool is 0.2.0.
If you prefer not to use the robius-packaging-commands tool, you can also write your own packaging commands. You can import your resources and Makepad resources however you like, but for simple resource importing we recommend using this tool for convenience.
For example:
1# packaging/before-packaging-command is your own helper for importing resources.
2# ⚠️ You still need to handle Makepad resources yourself, such as fonts.
3[package.metadata.packager]
4
5before-packaging-command = """
6cargo run --manifest-path packaging/before-packaging-command/Cargo.toml before-packaging
7"""
8
9before-each-package-command = """
10cargo run --manifest-path packaging/before-packaging-command/Cargo.toml before-each-package
11"""
The robius-packaging-commands tool essentially performs the import work above. Only create a new hook crate for cargo-packager if you really need to customize the import order.
Desktop packaging per platform
1. Linux (Debian/Ubuntu)
- Install the dependencies required for packaging:
1sudo apt-get update
2sudo apt-get install libssl-dev libsqlite3-dev pkg-config binfmt-support libxcursor-dev libx11-dev libasound2-dev libpulse-dev
- Run the packaging command:
1cargo packager --release
2. Windows (Windows-2022)
If you have already configured your Cargo.toml file as described above, you can run the packaging command:
1cargo packager --release --formats nsis
3. macOS
If you have already configured your Cargo.toml file as described above, you can run the packaging command:
1cargo packager --release
See more about robius-packaging-commands: [https://github.com/project-robius/robius-packaging-commands/blob/main/README.md]
2. Mobile Packaging
Fortunately, packaging Makepad for mobile is not as complex as desktop, because Makepad provides cargo-makepad as the tool for mobile app packaging.
Installcargo-makepad
1cargo install --force --git https://github.com/makepad/makepad.git --branch dev cargo-makepad
1. Android
Android can be packaged easily using cargo-makepad:
1cargo makepad android install-toolchain
2cargo makepad android build -p your_profile_name --release # This builds the apk, then you can install it on your device or emulator.
2. iOS
1cargo makepad apple ios install-toolchain
Use cargo-makepad to build the iOS app:
1cargo makepad apple ios --org=organisation_name --app=product_name run-sim/run-device -p your_profile_name --release
2
3In order for makepad to install an iOS application on a real device, a provisioning profile is needed.
4To create one, make an empty application in Xcode and give it an organization name and product name that you copy exactly,
5without spaces or odd characters, into --org=x and --app=x.
6 --stable use stable compiler
7Also run it on the device at least once so the profile is created
8 --org=organisation_name
9 --app=product_name
10If you have multiple signing identities, devices, or provisioning profiles, you might need to set them explicitly
11 --profile=
12 --cert=
13 --device=
Because cargo-makepad does not have a standalone build command, you can directly use the run-sim or run-device command to build the application and then package it.
1# Build and run the application on the iOS simulator
2cargo makepad apple ios --org=org.robius --app=robrix run-sim -p robrix --release
3
4# The cargo-makepad tool will compile and package the iOS application, generating the corresponding app bundle in ./target/makepad-apple-app/aarch64-apple-ios-sim/release/robrix.app.
5# Use the zip command to compress the .app directory into a .zip file, then distribute it or upload it to TestFlight or the App Store.
6
7# Build and run the application on an iOS device; --device (device_identifier) can be a virtual one.
8cargo makepad apple ios \
9 --org=org.robius \
10 --app=robrix \
11 --profile=$YOUR_PROFILE_PATH \
12 --cert=$YOUR_CERT_FINGERPRINT \
13 --device=IPhone \
14 run-device -p robrix --release
15
16# The cargo-makepad tool will compile and package the iOS application, generating the app bundle in ./target/makepad-apple-app/aarch64-apple-ios/release/robrix.app.
17cd ./target/makepad-apple-app/aarch64-apple-ios/release
18mkdir Payload
19cp -r robrix.app Payload/
20zip -r robrix-ios.ipa Payload
21# Then you can upload the generated .ipa file to TestFlight or the App Store.
3. Wasm Packaging
Makepad also supports compiling applications to WebAssembly (Wasm), which allows your app to run in the browser.
To package your application for Wasm, use the following commands:
1cargo makepad wasm install-toolchain # install Wasm toolchain
2cargo makepad wasm run -p your_profile_name --release
This builds your Makepad application as a Wasm module and runs it in the browser, while also generating the corresponding HTML and JavaScript files in the /target/makepad-wasm-app/release/your_profile_name/ directory.
It includes Makepad static resources, your application's resource files, the related js_bridge files, and the wasm module.
