Meteor Community Logo

Meteor Community

Packosphere

undefined's Avatar

ostrio:flow-router-extra

v3.13.0•Published 3 weeks ago

support support

FlowRouter Extra

Carefully extended flow-router package. FlowRouter is a very simple router for Meteor.js. It does routing for client-side apps and compatible with React, Vue, Svelte, and Blaze.

It exposes a great API for changing the URL and getting data from the URL. However, inside the router, it's not reactive. Most importantly, FlowRouter is designed with performance in mind and it focuses on what it does best: routing.

Features:

Install

meteor add ostrio:flow-router-extra

Compatibility

  • Meteor >=1.4, including latest Meteor 3.4;
  • Compatible with ostrio:flow-router-title@3.5.0 and ostrio:flow-router-meta@2.4.0.

ES6 Import

1import { FlowRouter } from 'meteor/ostrio:flow-router-extra';
2// Full list of available classes and instances:
3// { FlowRouter, Router, Route, Group, Triggers, BlazeRenderer, RouterHelpers }

Usage

1import { FlowRouter } from 'meteor/ostrio:flow-router-extra';
2
3// DISABLE QUERY STRING COMPATIBILITY
4// WITH OLDER FlowRouter AND Meteor RELEASES
5FlowRouter.decodeQueryParamsOnce = true;
6
7FlowRouter.route('/', {
8  name: 'index',
9  action() {
10    // Render a template using Blaze
11    this.render('layoutName', 'index');
12
13    // Can be used with BlazeLayout,
14    // and ReactLayout for React-based apps
15  },
16  waitOn() {
17    // Dynamically load JS per route
18    return [import('/imports/client/index.js')];
19  }
20});
21
22// Create 404 route (catch-all)
23FlowRouter.route('*', {
24  action() {
25    // Show 404 error page using Blaze
26    this.render('notFound');
27
28    // Can be used with BlazeLayout,
29    // and ReactLayout for React-based apps
30  }
31});

[!TIP] TypeScript: add zodern:types to the app (meteor add zodern:types), enable TypeScript per Meteor docs, then run a build so .meteor/local/types is generated. This package ships index.d.ts and package-types.json for meteor/ostrio:flow-router-extra imports.

Documentation

AGENTS.md

The repo ships AGENTS.md: a compact implementation map for ostrio:flow-router-extra (routes, groups, catch-all, hooks, globals, RouterHelpers, debugging, testing). It complements narrative API docs under docs/ with file pointers and conventions maintainers rely on.

SKILLS.md

  • This repo ships a bundled skill at .agents/skills/meteor-flow-router/SKILL.md (covers ostrio:flow-router-extra, ostrio:flow-router-meta, ostrio:flow-router-title). Install into your project with the Skills CLI (npx skills):
# From a Meteor app repo (install into that app’s .agents/skills for Cursor, etc.)
npx skills add veliovgroup/flow-router --skill meteor-flow-router --agent cursor --yes

# Only list skills discovered in the Flow Router repo (no install)
npx skills add veliovgroup/flow-router --list

# Local clone of flow-router (path can be absolute or ./relative)
npx skills add ./flow-router --skill meteor-flow-router --agent cursor --yes

# User-global Cursor skills dir (~/.cursor/skills)
npx skills add veliovgroup/flow-router --skill meteor-flow-router --agent cursor --global --yes

Running Tests

  1. Clone this package
  2. In Terminal (Console) go to directory where package is cloned
  3. Then run:

Meteor/Tinytest

# Default
meteor test-packages ./

# With custom port
meteor test-packages ./ --port 8888

# With local MongoDB and custom port
MONGO_URL="mongodb://127.0.0.1:27017/flow-router-tests" meteor test-packages ./ --port 8888

Running Typescript Test

  1. Install tsd as a global package;
  2. Run tsd in your terminal. tsd will find the correct *.test.d.ts file and return with any errors.

Support this project: