Skip to content

A Svelte preprocessor that allows to walk through the AST generated by the svelte parser and modify the markup with MagicString.

Notifications You must be signed in to change notification settings

kaisermann/svelte-markup-walker

Repository files navigation

Svelte Markup Walker

A Svelte preprocessor that allows to walk through the AST generated by the svelte parser and modify the markup with MagicString.

This library is a simple wrapper of svelte's exported parse and walk methods. Its default method accepts an option object of AST walker wrappers:

  • html({ content, filename }) for walking through the html AST;
  • instance({ content, filename }) for walking through the main script AST;
  • module({ content, filename }) for walking through the context="module" script AST;
  • css({ content, filename }) for walking through the style AST.

Each wrapper receives as arguments the current filename and the file content as a MagicString, which allows to easily modify/cut/overwrite/replace/etc its text.

const markupWalker = require('svelte-markup-walker');

/**
 * `preprocessor` is a svelte preprocessor,
 * just add it to your `preprocess` array
 */
const preprocessor = markupWalker({
  html({ content, filename }) {
    return {
      enter(node) { ... },
      leave(node) { ... },
    };
  },
  instance({ content, filename }) {
    return {
      enter(node) { ... },
      leave(node) { ... },
    };
  },
  module({ content, filename }) {
    return {
      enter(node) { ... },
      leave(node) { ... },
    };
  },
  css({ content, filename }) {
    return {
      enter(node) { ... },
      leave(node) { ... },
    };
  },
});

Example

TODO

About

A Svelte preprocessor that allows to walk through the AST generated by the svelte parser and modify the markup with MagicString.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published