Skip to content

Develop, Debug & Publish ​

The full path from creation to marketplace: create/import → edit in the IDE → compile & sync → verify on the page → submit for review → publish.

Development loop ​

  1. Create or import

    "Create New Project" offers Plain JavaScript and Vue 3 + TypeScript templates, and new projects start disabled. "Import From Local" accepts folders or file sets and picks the script named main / index / entry as the entry by default (regardless of the metadata header, falling back to the first script); you can change it in the import dialog. After importing, confirm the entry in the IDE's entry dropdown or with entryFile status in the terminal. Every app goes through the same compile pipeline.

    The metadata header (@name / @match / @require / @intercept and so on) is read from the entry file only, so move the header along when you switch the entry. A @require in a non-entry file's header only applies when that file is run directly from the terminal (run <file>), and the editor shows a Warning on that line; declare every built-in library the app uses in the entry (see Metadata).

  2. Edit in the IDE

    Development apps open directly in the IDE: editing, saving, and compiling in one place, plus an AI coding assistant and a terminal.

  3. Compile & sync

    Saving (Ctrl+S) only writes the sources to local storage; it does not compile. Clicking "Compile" at the top (which saves unsaved changes first) produces the artifact and registers it with chrome.userScripts; a new draft that has never been compiled is not registered at all. Running app enable on the current project in the terminal also saves first and recompiles when the artifact is stale.

  4. Verify on the page

    Run liveDebug on in the IDE terminal to compile and inject into the current matching tab. After that, every edit to the sources, including dependencies imported through @/ and ~/, soft-hot-reloads automatically a moment after you stop typing — no save needed. liveDebug compiles what is currently in the editor and only affects the debug tab; it does not update the registered artifact, so click "Compile" when you are done. Repeat liveDebug on to force a fresh compile/injection into the current document; run liveDebug reload to reload the whole page and re-inject clean (destroying every previous-generation artifact). liveDebug status reports injectionHealthy: true after the current target document is injected.

Enabling an app: instant activation ​

Enabling an app from any entry point (app management page / chat header toggle / "Apps on this page" popover / terminal app enable) registers the compiled artifact and the extension background hot-injects it immediately into every open tab that matches the app's scope (Chrome 135+) — no reload needed. Newly opened or reloaded pages keep using the normal registration path; a runtime guard prevents double execution. If the app is currently in liveDebug, enabling stops the live debug session first (the two are mutually exclusive) and the debug tab is switched over to the production instance after a clean teardown; if the debug instance registered no cleanups, that tab is skipped to avoid duplicate instances and you are prompted to refresh.

  • Two known limitations on already-open pages: @run-at document_start / document_end timing cannot be reproduced — the code runs at injection time on an already-loaded document; and LFRuntime.network only intercepts requests issued after the injection, earlier requests are not replayable. Reload the page for semantics identical to registration-based injection
  • Disabling still requires a reload to take effect on already-open pages (production instances register no cleanups, so there is no unload path); in chat mode, disabling auto-reloads the attached page per the user's settings

Cloud sources ​

"Save sources to cloud" uploads a source snapshot; "Sync cloud sources" restores it on another device or after an accidental delete. The "Cloud saved / Cloud diff" columns in the list show the current state.

Review & publish ​

  1. Submit for review

    Click "Submit for Review" in the list; fill in carousel images (≤5MB each), pricing (free / monthly / yearly), trial plan, and release notes.

  2. Wait for review

    The app moves to the "Reviewing" tab. Approval publishes it automatically; rejections show the reason in the list and can be resubmitted.

  3. After publishing

    The app appears in the marketplace where users can inspect, install, and rate it. Track installs, revenue, and orders under "Sales Data".

File permissions ​

If the app needs to read or write the user's local files through LFHttp.client.fs (outside the IDE workspace), configure the scope under "File Permissions" in the list; users see a matching prompt at install time.