Git Product home page Git Product logo

sourcemap-blender's Introduction

Sourcemap Blender

Build Status

This project is for those who struggle with broken source maps because of:

  • Re-formatted code.
  • AST modifications

sourcemap-blender works magic. It takes original source maps, original AST and the generated code (could be generated with pretty much any generator with any format), walks the AST nodes and updates the original source maps with new positions. What's really unique about this library is that you can modify the code, as in, add new nodes, remove e.t.c and the library will still find the unchanged nodes and re-wire them.

How to use

First install it from NPM

npm install sourcemap-blender
import { Blender } from "sourcemap-blender";
import * as acorn from "acorn";

const blender = new Blender({
  parse: source =>  acorn.parse(source),
  originalMap: originalMap,
  originalAST: originalAST,
  modifiedCode: modifiedCode
});
async function init(){
  const blender = await blender.blend();
  // blender.map
}
init();

originalMap is the source map that you want to be fixed, originalAST is the AST tree that contains the correct mappins.

After you've played around with nodes, you can generate the code with escodegen for example:

escodegen.generate(modifiedAST)

escodegen is a great library, but what i've been struggling with is that it changes the formatting, ignoring the locations. The generated code will break the sourcemaps 100%. But that's where sourcemap-blender comes in handy

Have fun!

sourcemap-blender's People

Contributors

nchanged avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.