alangpierce / sucrase

Super-fast alternative to Babel for when you can target modern JS runtimes
https://sucrase.io
MIT License
5.67k stars 143 forks source link

How to generate source maps #445

Open kiliancs opened 5 years ago

kiliancs commented 5 years ago

Looking at the source code I see that by providing sourceMapOptions and a filePath Sucrase should generate source maps. I also see that the filePath option is provided by the webpack loader. In the same context of webpack, how do I obtain the compiledFilename, which is a mandatory prop of sourceMapOptions?

This naive loader configuration doesn't seem to be producing source maps:

const sucraseLoader = {
    loader: '@sucrase/webpack-loader',
    options: {
        transforms: ['jsx', 'typescript', 'imports'],
        sourceMapOptions: { compiledFilename: '' },
    },
};

Thank you in advance!

remorses commented 4 years ago

Is there a way to generate source maps with the cli too?

johnpangalos commented 4 years ago

As for webpack, take a look a this (I believe it makes the sucrase website.) https://github.com/alangpierce/sucrase/blob/4163973a06fa9f4ac9a2d6b9cc0f04b343fe643d/website/config/webpack.config.dev.js

Raynos commented 4 years ago

In theory source maps are not needed with sucrase because the compiler preserves line numbers.

You can just look at the JS it generates without the type annotations.

jbolda commented 3 years ago

I believe we have gotten source maps created and the chrome debugger using these to point directly to the source files. The last part is this PR for anyone coming across this. https://github.com/backstage/backstage/pull/5841