search

sass / sassc-rails

Integrate SassC-Ruby with Rails!
MIT License
707 stars 104 forks source link

Add source map on debug mode with Sprockets 4 #162

Open GCorbel opened 3 years ago

GCorbel commented 3 years ago

This fix https://github.com/sass/sassc-rails/issues/161. With Sprockets 4, when debug mode was enabled, the source map wasn't added correctly at the end of the file.

jrochkind commented 3 years ago

This branch does make SCSS sourcemaps work for me with sprockets 4 (in Rails).

Without the fix in this branch, dev tools debugging of SCSS was pretty impossible in sprockets 4; I had to disable source maps in my browser. (The source maps resulted in unusable mapping, where Chrome just though every line of CSS came from an @import statement, and I couldn't figure out how to disable source map generation altogether for sprockets).

Thanks @GCorbel, amazing work.

I would love to see this merged and in a sassc-rails release, so I can re-enable use of source maps in Chrome.

(Still very mystified why this hasn't been a higher-profile issue; is nobody else using SCSS and sprockets 4? That seems hard to believe, as they are both standard installs in a new rails app. Mystified!)

GCorbel commented 3 years ago

@jrochkind thanks for your review. I applied your comments and did some refactoring.

GregLMcDonald commented 3 years ago

Would love to see this fix deployed in a new release. Debugging sass in a complex app is pretty painful as things stand.

panozzaj commented 1 year ago

I ran into this issue today, and fixed by using the code in this PR:

  1. Made my Gemfile reference these commits:
gem 'sassc-rails', github: 'GCorbel/sassc-rails', branch: 'add-source-maps-on-debug'
  1. Changed ./config/environments/development.rb to have:
  config.sass.inline_source_maps = true
  config.assets.debug = true
  1. rm -rf ./tmp/cache based on the gem's README
  2. Restarted my development server
  3. Now the Chrome Inspector directly links to the SCSS source.

I would +1 merging and cutting a new release, as a result.

(I am not a maintainer of this project, just a user.)