The webflow.json file houses configuration for a Webflow Designer Extension app and defines parameters that control its behavior. Developers should use this file to include important details such as the app’s name, size, and public directory.

Properties

namestringRequired

Specifies the name of the Webflow App. It should be a descriptive and unique name that helps identify the app.

apiVersionstringOptional

The version of the Designer APIs your app is using. It’s highly recommended to set this value to "2"

sizestringOptional

Defines the size of the Designer Extension window. Available sizes include:

  • default: 240px by 360px - Great for simple apps that don’t require much real estate
  • comfortable: 320px by 460px - For apps like form submissions that may require a bit more room
  • large: 800px by 600px - For apps that require in-depth work flows, previews, or in depth control

If a size is not declared in the webflow.json file, the Designer Extension window will open to the default size of 240px by 360px. To be explicit about this behavior, you can add {"size": "default"} to your manifest file. Note that you can also dynamically change the size of the window using the webflow.setExtensionSize() API.

publicDirstringOptional

Determines the directory to build and serve the app from when bundling your Designer Extension. By defining a custom publicDir, you can have more control over the organization and structure of your app’s static files.

If a publicDir is not declared in the webflow.json file, the Designer Extension will expect to load the designer extension from the /public directory. To be explicit about this behavior, you can add { "publicDir": "public" } to your manifest file.

appIntentsstringOptional

Use the appIntents parameter to define the element types that can create connections to your App. See the documentation on App Intents for more details.

appConnectionsstringOptional

Include the appConnections parameter with an array of unique identifiers that can be use to establish connections between your app and elements on the canvas. See the documentation on App Connections for more details.

Was this page helpful?
Built with