pipedream code formatter & beautifier
pipedream code steps use defineComponent with `steps` (previous step outputs), `$` (pipedream utilities like `$.export`, `$.respond`, `$.send.http`), and a bound `this` for props/auth. trigger data is at `steps.trigger.event`; secrets via `process.env`. for http calls, use `$.send.http()` or `require('axios')`.
pipedream components use defineComponent with a run method that receives steps (previous step outputs) and $ (pipedream utilities like $.export and $.respond).
codefmt beautifies your code by wrapping it in the correct defineComponent structure before formatting, so you can paste just the function body and get clean, formatted code back.
pipedream supports two component types: actions (defineComponent with run({ steps, $ })) and sources (defineSource with run(event)). codefmt handles both patterns, including typescript support for type-safe pipedream development. the pipedream lint plugin catches common mistakes and validates your use of $.export(), $.respond(), and other pipedream-specific APIs.
frequently asked questions
what is $.export() in pipedream?
$.export('key', value) makes data available to downstream steps. it's how you pass data between pipedream steps. codefmt recognizes $ as a valid global and won't flag it as undefined.
how do I access data from previous steps?
use steps.step_name.return_value or steps.trigger.event to access data from previous workflow steps. codefmt recognizes the steps object as a valid pipedream global.
what is the difference between actions and sources in pipedream?
pipedream has two component types. actions are reusable steps in a workflow that perform a single operation — they're defined with defineComponent and their run method receives ({ steps, $ }). sources are event triggers that emit data into workflows — they're defined with defineSource and their run method receives (event) directly. codefmt supports both and wraps your code in the correct structure for each.
does codefmt support typescript in pipedream?
yes. pipedream supports typescript natively in components, and codefmt handles ts-specific syntax like type annotations, interfaces, and generics. select the pipedream platform variant and paste your typescript code for proper formatting and linting with pipedream globals recognized.
how does defineComponent work in pipedream?
defineComponent is the wrapper used by pipedream actions. it accepts an object with props, methods, and a run method. the run method receives ({ steps, $ }), giving you access to previous step outputs (steps) and pipedream utilities ($.export, $.respond, $.send.http). codefmt understands this structure and formats both the component wrapper and the function body correctly.
how do pipedream sources differ from actions in signature?
sources use defineSource and their run method receives the triggering event directly: run(event). they emit data via this.$emit(...) and persist state via this.db when a db prop is declared. unlike actions, sources do not receive steps or $ — they're the first thing in the workflow. codefmt applies the correct wrapper when you switch to the source variant.
also format code for zapier, n8n, make, hubspot ops hub, hubspot cms (hubl)
other tools: json formatter, python formatter, snippets