Navigation

Upload Content to Stitch

On this page

Overview

You can upload content to Stitch from the Hosting screen of the Stitch UI or by importing an application directory that includes the files. Select the tab below that corresponds to the method you want to use.

Procedure

1
2

Upload Files to Stitch

You can upload files to Stitch individually or select multiple files or file directories to upload simultaneously. All files that you upload must be available on your local filesystem.

There are two ways to upload files through the Stitch UI. You can use either of the following methods:

  • Drag and drop files from your local filesystem on to the Hosting screen.
  • Click Upload Files and select the files you wish to upload from a file picker.

Once you have dropped in or selected your files, Stitch will begin uploading them immediately. The upload might take some time to complete depending on the number and size of the files you selected as well as your network connection.

1

Export Your Stitch Application

To upload files to Stitch with stitch-cli you need an application directory for your application.

You can export your application from the Export tab of the Settings page in the Stitch UI, or by running the following command from an authenticated instance of stitch-cli:

stitch-cli export --app-id=<App ID> --include-hosting
2

Add a Hosting Directory

Note

This step is only necessary if you did not export your Stitch app with the --include-hosting flag.

Stitch looks for files to upload in the /hosting/files subdirectory of your application directory. If this directory doesn’t already exist, create it:

mkdir -p hosting/files
3

Add a Metadata Configuration File

To deploy hosted files through Stitch CLI you must include a metadata.json file in the /hosting directory. If the configuration file does not exist, create it:

touch hosting/metadata.json

The configuration does not need to specify metadata for any files but must be present. For more information, see Configure File Metadata.

metadata.json
[
  {
    "path": "<File Resource Path>",
    "attrs": [{
      "name": "<Attribute Type>",
      "value": "<Attribute Value>"
    }]
  }
]
Field Description
path Required. The resource path of the file.
attrs

Required. An array of documents where each document represents a single metadata attribute. Attribute documents have the following form:

Metadata Attribute Document
{
  "name": "<Attribute Type>",
  "value": "<Attribute Value>"
}
Field Description
name The name of the metadata attribute. This should be one of the file metadata attributes that Stitch supports.
value The value of the metadata attribute.

Note

If you include an entry in metadata.json for a file that does not exist, you will not be able to import your changes. Ensure that only hosted files are represented in metadata.json.

4

Add Files to the Hosting Directory

To upload or edit files, add them to the /hosting/files subdirectory of your application directory. When you import your application, Stitch will map this subdirectory to the root of your application’s hosted file tree.

Note

You can nest additional directories inside of the /hosting/files subdirectory. Nested directories are listed before a file’s name in its resource path.

5

Import the Files

Once you have added the files you want to host to the /hosting/files subdirectory, you can upload them to Stitch by importing your updated application directory with the --include-hosting flag:

stitch-cli import --include-hosting

After successfully importing the application directory, Stitch will begin uploading your files. The upload might take some time to complete depending on the number and size of the files you selected as well as your network connection.