emberjs/ember.js · error · SyntaxError

Mixing '.' and '/' in paths is not supported in Glimmer; use

Error message

Mixing '.' and '/' in paths is not supported in Glimmer; use only '.' to separate property paths

What it means

Glimmer only accepts '.' as the property-path separator. Paths that mix '.' and '/' (a legacy Ember idiom like this.controller.property or foo/bar.baz) are rejected by the PathExpression visitor so templates fail fast at compile time rather than resolving in unexpected ways at runtime.

Source

Thrown at packages/@glimmer/syntax/lib/parser/handlebars-node-visitors.ts:411

  PathExpression(path: HBS.PathExpression): ASTv1.PathExpression {
    const { original } = path;
    let parts: string[];

    if (original.indexOf('/') !== -1) {
      if (original.slice(0, 2) === './') {
        throw generateSyntaxError(
          `Using "./" is not supported in Glimmer and unnecessary`,
          this.source.spanFor(path.loc)
        );
      }
      if (original.slice(0, 3) === '../') {
        throw generateSyntaxError(
          `Changing context using "../" is not supported in Glimmer`,
          this.source.spanFor(path.loc)
        );
      }
      if (original.indexOf('.') !== -1) {
        throw generateSyntaxError(
          `Mixing '.' and '/' in paths is not supported in Glimmer; use only '.' to separate property paths`,
          this.source.spanFor(path.loc)
        );
      }
      parts = [path.parts.join('/')];
    } else if (original === '.') {
      throw generateSyntaxError(
        `'.' is not a supported path in Glimmer; check for a path with a trailing '.'`,
        this.source.spanFor(path.loc)
      );
    } else {
      parts = path.parts;
    }

    let thisHead = false;

    // This is to fix a bug in the Handlebars AST where the path expressions in
    // `{{this.foo}}` (and similarly `{{foo-bar this.foo named=this.foo}}` etc)

View on GitHub (pinned to 26f97246a8)

Solutions

  1. Replace every '/' separator in the expression path with '.': {{model/user.name}} becomes {{model.user.name}}.
  2. Resolve the earlier segments in JS instead: use a getter or helper (e.g. {{get this.model "user.name"}} or a computed property) so the template path is pure dot notation.
  3. If you meant a route URL or asset path, move it into a string literal or helper argument, not a property path.
  4. Update any template codegen/linting so it emits dot-separated paths only.

Example fix

// before
{{model/user.name}}

// after
{{model.user.name}}
Defensive patterns

Strategy: validation

Validate before calling

// validate expression paths before compiling
function assertDotOnlyPaths(template) {
  // catch '/' used as a path separator inside {{ }} expressions
  const bad = template.match(/{{[^}]*\/[.,a-zA-Z@][^}]*}}/g);
  if (bad) throw new Error(`Paths mixing '.' and '/': ${bad.join(', ')}`);
}
assertDotOnlyPaths(template);

Prevention

When it happens

Trigger: Compiling a template containing a path expression whose original string contains a '.' anywhere (when it also contains '/', or in general inside the dot-check branch): e.g. {{model/user.name}}, {{a/b.c}}, helpers written as foo/bar in an expression. The visitor throws when original.indexOf('.') !== -1 after the '../' check.

Common situations: Porting very old Ember 1.x templates where '/' separated actions/actions or nested routes (e.g. {{action "save" on="controller"}} era code or users/4 path-style bindings); hand-written paths confusing route URLs with property paths; code generators mixing the two separators.

Related errors


AI-assisted analysis of emberjs/ember.js@26f97246a8 (2026-09-01). Data as JSON: /api/errors/5055665ef0d7a9ed. Report an issue: GitHub.