agentleFS
meteormeteor/agent-skills/skills/meteor-blaze/SKILL.md

meteor-blaze

Skill10 starsChanged 3 months agoMITView on GitHub

Use when building or debugging Blaze interfaces in Meteor 3: meteor create --blaze, Spacebars templates, Template helpers and events, lifecycle hooks, Tracker, ReactiveVar or ReactiveDict, template subscriptions, Promise helpers, #let async states, Template.dynamic, Blaze.render, and blaze-hot HMR with the Meteor bundler. Triggers on stale async helper results, lost reactivity after await, data-context lookup surprises, duplicate DOM integrations after HMR, Rspack full reloads, or raw HTML in triple braces. Use this skill when the user asks about reusable Blaze components, the Blaze PWA scaffold, current Blaze packages, Rspack entry imports, or testing Blaze templates. For Meteor 2 to 3 upgrades, use migrate-to-meteor-3 instead.

1 other project uses a version of this.

Adopted by

Most recently taken up by

The file

We split this skill into the rules it gives an agent

12 rules. About 0 are common, 2 are distinctive, and 10 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈2

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 10

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Very specific:

    Import each template's .html from the JavaScript module that registers its helpers, events, and lifecycle hooks.

    line 37
  2. Distinctive:

    Keep synchronous Minimongo reads in ordinary helpers.

    line 40
  3. Very specific:

    Put ReactiveVar, ReactiveDict, this.autorun, and this.subscribe on the template instance.

    line 42
  4. Distinctive:

    Treat the generated files for the selected Meteor release as the baseline.

    line 65
  5. Very specific:

    Do not infer the installed Blaze runtime from the release name alone.

    line 70
  6. Very specific:

    Use #let when loading, rejection, and empty results must be distinct:

    line 136
  7. Very specific:

    Read references/lifecycle-and-components.md for data-context rules, callbacks, dynamic templates, DOM scoping, and cleanup patterns.

    line 164
  8. Very specific:

    Use references/build-hmr-and-testing.md only for Blaze-specific entry imports, HMR ownership, and programmatic template tests.

    line 180
  9. Very specific:

    Read reactive data only after await without restoring the captured Tracker computation.

    line 187
  10. Very specific:

    Treat {{#each ...}}{{else}} as a loading indicator.

    line 189
  11. Very specific:

    Use global $() or document.querySelector for component DOM.

    line 192
  12. Very specific:

    Remove DOM nodes created by Blaze.render without calling Blaze.remove.

    line 196

≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Blaze interfaces for Meteor 3

Blaze compiles Spacebars templates into JavaScript and updates small View regions when their reactive dependencies invalidate. Keep state, subscriptions, DOM effects, and async work owned by a template instance. Use public Template, Blaze, Spacebars, and Tracker APIs in application code.

Decision flow

  1. For a new app, run meteor create --blaze <name>. Inspect the generated package.json, .meteor/packages, client entry, and rspack.config.js before changing packages or build settings.
  2. Import each template's .html from the JavaScript module that registers its helpers, events, and lifecycle hooks. Import that module from the client entry graph.
  3. Keep synchronous Minimongo reads in ordinary helpers. If a helper returns a Promise, render explicit pending, rejected, and resolved states.
  4. Put ReactiveVar, ReactiveDict, this.autorun, and this.subscribe on the template instance. Put DOM initialization in onRendered and undo external effects in onDestroyed.
  5. Pass named data and callbacks into reusable child templates. Keep publication and mutation authority on the server.
  6. Identify the bundler before diagnosing refresh behavior. blaze-hot can replace templates in the Meteor-bundler graph; Rspack currently performs a full live reload for Blaze. Route general build, migration, database, or test-runner work to the owning skill.

Current scaffold

meteor create --blaze my-app
cd my-app
meteor

Meteor 3.4+ creates Blaze apps with Rspack by default. Earlier Meteor 3 releases may use the Meteor bundler. The current scaffold declares explicit client and server meteor.mainModule entries, imports .html from the client entry, enables the modern build stack, and includes blaze-html-templates, tracker, reactive-var, hot-module-replacement, blaze-hot, and rspack. Treat the generated files for the selected Meteor release as the baseline. Those packages do not enable Blaze HMR in the Rspack graph. Blaze edits there trigger a fast full page reload and reset page-local state. blaze-hot replacement behavior applies when the Meteor bundler owns the module.

Do not infer the installed Blaze runtime from the release name alone. Inspect .meteor/versions, then use the Blaze history for feature floors and compatibility changes.

Meteor 3.6-beta.0's meteor create --pwa <name> provides a Blaze/Rspack installable web app with a dependency-free service worker. It does not supply offline Meteor data or native binaries. Read PWA boundaries before changing caching or scope.

Component scaffold

<template name="taskList">
  <label>
    <input type="checkbox" class="js-show-done">
    Show completed
  </label>

  {{#if Template.subscriptionsReady}}
    {{#each task in tasks}}
      {{> taskRow task=task}}
    {{else}}
      <p>No tasks.</p>
    {{/each}}
  {{else}}
    <p>Loading...</p>
  {{/if}}
</template>
import { Template } from "meteor/templating";
import { ReactiveVar } from "meteor/reactive-var";
import { Tasks } from "/imports/api/tasks";
import "./task-list.html";

Template.taskList.onCreated(function () {
  this.showDone = new ReactiveVar(false);
  this.autorun(() => {
    this.subscribe("tasks.list", { showDone: this.showDone.get() });
  });
});

Template.taskList.helpers({
  tasks() {
    const showDone = Template.instance().showDone.get();
    return Tasks.find(showDone ? {} : { done: false }, {
      sort: { createdAt: -1 },
    });
  },
});

Template.taskList.events({
  "change .js-show-done"(event, instance) {
    instance.showDone.set(event.currentTarget.checked);
  },
});

this.autorun and this.subscribe stop when the instance is destroyed. A cursor returned from a synchronous helper remains live through Minimongo. Authorization and field projection still belong in the publication.

Async helpers

Use #let when loading, rejection, and empty results must be distinct:

{{#let profile=loadProfile}}
  {{#if @pending "profile"}}<p>Loading...</p>{{/if}}
  {{#if @rejected "profile"}}<p>Could not load profile.</p>{{/if}}
  {{#if @resolved "profile"}}
    {{> profileCard profile=profile}}
  {{/if}}
{{/let}}

Spacebars stores the latest resolved value, not necessarily the result of the latest Promise. If reactive input can launch overlapping requests, use an abort signal, generation token, or serialized queue. Do not assume #let orders results. See references/spacebars-and-async.md.

Lifecycle ownership

ResourceCreateDestroy
ReactiveVar or ReactiveDictonCreatedNo manual disposal
Reactive workthis.autorunAutomatic with the instance
Subscriptionthis.subscribeAutomatic with the instance
DOM widgetonRendered, often after Tracker.afterFlushWidget-specific teardown in onDestroyed
Window, document, timer, observerLifecycle callbackExplicit remove, clear, disconnect, or stop in onDestroyed
Programmatic Blaze ViewBlaze.render or Blaze.renderWithDataBlaze.remove(view)

Read references/lifecycle-and-components.md for data-context rules, callbacks, dynamic templates, DOM scoping, and cleanup patterns.

Routing boundaries

RequestRoute
Fresh Blaze UI, Spacebars, template lifecycle, async renderingThis skill
General Rspack or SWC setup and configuration helpersmeteor-modern-build-stack
Convert an existing app to Rspackmigrate-to-rspack
Upgrade Blaze code from Meteor 2 to Meteor 3migrate-to-meteor-3
Publication design or subscription authorizationmeteor-pubsub
Mongo and Minimongo API decisionsmeteor-mongo-minimongo
Mocha driver, browser runner, or E2E setupmeteor-testing
CSP, sanitization review, or broader hardeningmeteor-security

Use references/build-hmr-and-testing.md only for Blaze-specific entry imports, HMR ownership, and programmatic template tests.

Anti-patterns

  • Return async Minimongo values from every helper. Prefer synchronous client reads unless the flow is already async or shared with the server.
  • Read reactive data only after await without restoring the captured Tracker computation.
  • Treat {{#each ...}}{{else}} as a loading indicator. The else branch also covers rejection and a resolved empty sequence.
  • Pass implicit inherited contexts through reusable templates. Pass named data.
  • Use global $() or document.querySelector for component DOM. Scope lookup to the template instance.
  • Insert user-controlled content through triple braces or Spacebars.SafeString without trusted sanitization.
  • Remove DOM nodes created by Blaze.render without calling Blaze.remove.
  • Rely on private or removed UI-era APIs such as UI.body, Template.__define__, Template.__body__, Spacebars.TemplateWith, or Blaze.InOuterTemplateScope.

Authoritative resources

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.