Skip to content

ErickXavier/nojs-lsp

No.JS LSP — v1.11.0

VS Code extension providing full language server support for the No.JS HTML-first reactive framework.

Also works as a standalone language server (--stdio) for Neovim, Sublime Text, Emacs, and any LSP-compatible editor.

Features

Completions

  • Directive completions — All 40+ No.JS directives (state, if, get, each, model, etc.)
  • Dynamic directivesbind-*, on:*, class-*, style-* with common targets/events
  • Companion attributes — Context-aware: shows as, loading, error only when get is present
  • Event modifiers.prevent, .stop, .once, .debounce, .throttle, key modifiers
  • Filter completions — All 32 built-in filters after | in expressions
  • Filter argument hints — Shows argument name, type, and defaults after :
  • Validator completions — Built-in validators for validate attribute
  • Animation completions — All built-in animation names
  • Context keys$store, $refs, $route, $router, $i18n, $form
  • i18n key completions — Scans locales/ for translation keys and suggests them in t="..." attributes
  • Route completions — Scans pages/ directory for file-based routes
  • Wildcard route (route="*") completions, hover, and diagnostics
  • Store property completions — Parses store declarations to suggest $store.name.prop
  • Template var completions — Suggests var-* attributes matching template slot declarations
  • Custom directive completions — Detects NoJS.directive() calls in workspace JS files
  • Head management directivespage-title, page-description, page-canonical, page-jsonld completions and hover
  • Plugin system support — Plugin snippets, interceptor patterns, and TypeScript type references

Hover Documentation

  • Directive purpose, syntax, and examples
  • Companion attribute descriptions
  • Filter documentation with arguments
  • Context key ($store, $refs) and loop variable ($index, $count) descriptions

Diagnostics

  • Unknown directive warnings (with "did you mean?" suggestions)
  • Orphaned else / else-if detection
  • Unknown filter warnings
  • Empty required values
  • Invalid event modifiers
  • Duplicate state declarations
  • Duplicate ref names
  • Duplicate wildcard route detection per outlet
  • Template ID referenced but not defined
  • Missing as for HTTP directives
  • Expression syntax validation
  • model on non-form elements
  • Invalid animation name
  • Unknown validator name
  • Head management directive validation

Go-to-Definition

  • use="id" → jump to <template id="id">
  • $refs.name → jump to ref="name" element
  • $store.name → jump to store declaration
  • Template-referencing attributes (then, else, loading, error, empty, success, error-boundary)

Find References

  • Find all usages of a template ID across the document
  • Find all references to a ref name ($refs.xref="x")
  • Find all store accesses ($store.xstore)

Document Symbols

  • state → Variable, store → Module, ref → Field
  • <template id> → Class, route-view → Namespace
  • computed → Property, watch → Event, HTTP methods → Function

Document Links

  • HTTP directive URLs as clickable links
  • Template src and route-view src as file/directory links
  • call URLs and redirect paths as clickable links

Semantic Highlighting

  • Directive names → keyword
  • Dynamic prefixes (bind-, on:, class-, style-) → decorator
  • Filter names → function, pipe | → operator
  • Store references → variable.readonly
  • Loop context vars → variable.builtin

Code Actions

  • Quick fix: add missing as for HTTP directives
  • Quick fix: "did you mean?" for typos in directive names

Inlay Hints

  • Loop variable names for each and foreach (→ $index, $count, $first, $last)
  • HTTP method badge for get/post/put/patch/delete with as

Snippets

  • 31 built-in snippets for common patterns (if, each, foreach, get, store, form, call, notify, page-title, plugin, etc.)

Configuration

Setting Default Description
nojs.validation.enabled true Enable/disable all No.JS diagnostics
nojs.completion.filters true Show filter completions in pipe expressions
nojs.customFilters [] Additional custom filter names for completions
nojs.customValidators [] Additional custom validator names for completions
nojs.trace.server "off" Trace communication between client and server
nojs.devtools.enabled false Enable live DevTools Protocol connection
nojs.devtools.port 9222 Chrome DevTools Protocol port
nojs.devtools.host "localhost" Chrome DevTools Protocol host

Development

# Install dependencies
npm install

# Build
npm run compile

# Run tests
npm test

# Package extension
npm run package

Ecosystem

Package Description
No.JS Core framework — 40+ directives, 32 filters, routing, forms, i18n, animations
No.JS LSP This extension — language server for VS Code and other editors
No.JS MCP MCP server for AI assistants — validate, explain, scaffold
No.JS CLI CLI tooling — init, dev, prebuild, validate, plugin
No.JS Skill Claude Code AI skill for No.JS development

License

MIT © Erick Xavier

About

VS Code extension with full LSP support for the No.JS HTML-first reactive framework; completions, hover docs, diagnostics, go-to-definition, and more.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Packages

 
 
 

Contributors