Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Source mappings wrong when using compressed style #1896

Open
david10sing opened this issue Feb 26, 2023 · 9 comments
Open

Source mappings wrong when using compressed style #1896

david10sing opened this issue Feb 26, 2023 · 9 comments

Comments

@david10sing
Copy link

Context

I am experiencing an issue when using the JS API, sourcemap compile option when used in tandem with style = compressed.

The source map is produced and I write it to a file. However, the mappings are broken and in Chrome's devtools, I am seeing styles pointing to the wrong file.

Screenshots

Wrong

image

Correct

image

Question

  • Is this something that's known or it is not behaving correctly and might be due to the repository's setup and the scss files?
@nex3
Copy link
Contributor

nex3 commented Feb 28, 2023

Can you provide a minimal repo that reproduces this issue?

@david10sing
Copy link
Author

david10sing commented Mar 1, 2023

Hi @nex3

Here is a link to a reproduction repo

https://github.com/david10sing/minified-sass-breaking-sourcemap

@nex3
Copy link
Contributor

nex3 commented Mar 2, 2023

That repro looks like it passes the Sass output, including the sourcemap, through PostCSS. Can you reproduce it with Sass alone?

@david10sing
Copy link
Author

david10sing commented Mar 6, 2023

Hi @nex3

Removed the postcss processing.

As you will see, it has the same issue. I also renamed the class names so it's clearer. .index should come from index.scss but is instead pointing to _test.scss

@nex3
Copy link
Contributor

nex3 commented Mar 6, 2023

I can't reproduce that. Here's what I did:

$ git clone https://github.com/david10sing/minified-sass-breaking-sourcemap
$ cd minified-sass-breaking-sourcemap
$ npm i
$ mkdir dist
$ node sass-compiler.js

I then opened https://sokra.github.io/source-map-visualization/ and uploaded the generated index.css and index.css.map files. The .index class is clearly mapped to the correct location in index.scss.

@david10sing
Copy link
Author

@nex3

It's not in chrome devtools inspector

@nex3
Copy link
Contributor

nex3 commented Mar 7, 2023

That sounds like a bug in the chrome devtools inspector. Have you tried reporting it there?

@david10sing
Copy link
Author

Thank you @nex3

Reported ☝️

@ntkme
Copy link
Contributor

ntkme commented Mar 9, 2023

@david10sing That is not the right place for chrome bugs, please follow instructions on this page: https://www.chromium.org/for-testers/bug-reporting-guidelines/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants