Skip to main content

Create Showpad Bundle

You're in the home stretch! It's time to bundle your app. Bundling optimizes your code to reduce the number of server requests.

To bundle your app, you need to:

  1. Increment your app version
  2. Build your app
  3. Create a Showpad bundle

Increment Version​

Incrementing your app's version allows you to distinguish between different releases. You can increase your app’s version by modifying the version field in the manifest.json.

tip

It's a good idea to use pre patches or tagged versions while developing in order to have consistent versioning while testing multiple versions in production.

Examples: 1.0.0-x | 1.0.0-beta.1 | 1.0.0-rc.1

Build App​

Once your app's version is incremented, you need to generate the production files. This is known as a build.

If your app has multiple Extension types, you must build each Extension individually. All of the files required to run your Extension (the output of a build) must be in a distribution subfolder, often named dist.

To build your Extensions individually, run the build command within the folders of each Extension type.

npm run build

When you've built all of your Extensions:

  1. Rename the dist folder of each Extension to the name of its Extension (as defined in the manifest).
  2. Move the renamed folders to a dist folder at the root of your app.
  3. Copy the manifest to the dist folder at the root of the app.

Showpad Bundle​

The last step in the process is to create a Showpad bundle. There are two ways to create your bundle:

Showpad CLI​

The apps bundle command creates a .showpad bundle for your app, as well as validates the manifest.json file and the size of your bundle.

npx showpad apps bundle

Manually​

In the root folder of your app, run the following command:

zip -r ../my-app.showpad *

The Showpad bundle is now available in the root folder of your Showpad App!