gohugoio / hugo

The world’s fastest framework for building websites.
https://gohugo.io
Apache License 2.0
73.53k stars 7.38k forks source link

Add `map` option to PostCSS options. #4980

Open tech4him1 opened 5 years ago

tech4him1 commented 5 years ago

There is currently a no-map setting allowed for PostCSS, which disables the inline sourcemaps. However there is no options for having external sourcemaps generated. Looking into the PostCSS docs and the postcss-cli code, it looks like a --map option can be passed to the CLI to enable "separate-file" sourcemaps.CLI code docs

I request that a "map" option is added along-side the "noMap" option that can already be passed into the PostCSS resource function.

stale[bot] commented 5 years ago

This issue has been automatically marked as stale because it has not had recent activity. The resources of the Hugo team are limited, and so we are asking for your help. If this is a bug and you can still reproduce this error on the master branch, please reply with all of the information you have about it in order to keep the issue open. If this is a feature request, and you feel that it is still relevant and valuable, please tell us why. This issue will automatically be closed in the near future if no further activity occurs. Thank you for all your contributions.

tech4him1 commented 5 years ago

I feel this is still an important feature request, as right now SASS and PostCSS sourcemaps cannot be used together through Hugo. The underlying PostCSS engine is already designed to support this usecase, so Hugo should only have to create a hook to allow it, as described in the OP.

bep commented 5 years ago

The underlying PostCSS engine is already designed to support this usecase, so Hugo should only have to create a hook to allow it, as described in the OP.

I think you are over-simplifying this. If this was simple, I would have already done it when I added this feature.

tech4him1 commented 5 years ago

@bep Do you have any specific information on what you would need? I'm not comfortable with submitting a patch in Golang, but I could try to work on some code that you could use as a starting point if you'd like.

DennisJohnsen commented 5 years ago

+1 for this feature.

We at our web development department in LEGO A/S are currently rolling out a new framework for building websites, that uses HUGO to generate the pages. I'm trying to set up the best possible development environment for other frontend developers in our department. Therefore a better way than using inline source mapping would be awesome for debugging the SCSS structure directly from the browser.

bep commented 5 years ago

So,

The current implementation reads from PostCSS's output stream - which, I assume, is only "one thing". So to implement the map option, you would have to write to files. Which would be slower, but that should be negligible and could be wrapped in an if map construct.

That said,

For that to be of any value, PostCSS would need to construct a source map of the entire chain of source maps (SCSS ... PostCSS). If you cannot navigate from "right click element" in Chrome to the style implementation in the SCSS, I'm not sure what value it gets you.

So, the current way to do this is to be a little bit pragmatic during development:

{{ if eq hugo.Environment "production" }}
{{ $css = ... | toCSS | postCSS }}
{{ else }} 
{{ $css = ... | toCSS $optionsWithSourceMap }}
{{ end }}

So, before we start to spend time supporting a map option, someone would have to look at how it would work once implemented.

/cc @regisphilibert

regisphilibert commented 5 years ago

PostCSS + Pipes expert around here is @budparr

DennisJohnsen commented 5 years ago

Hmm, i guess that could be a solution as well, to use an environment variable. Since we don't really need to have source maps available on the live environment.

I can hand this solution over to the team tomorrow, as i think it might be good enough for a proper development environment. Thanks for the quick reply btw 😃

On another note; I can also say we're looking forward for HUGO being able to support JSON directly instead of Markdown. It will make a lambda obsolete and make our whole pipeline much cleaner 👍

stale[bot] commented 5 years ago

This issue has been automatically marked as stale because it has not had recent activity. The resources of the Hugo team are limited, and so we are asking for your help. If this is a bug and you can still reproduce this error on the master branch, please reply with all of the information you have about it in order to keep the issue open. If this is a feature request, and you feel that it is still relevant and valuable, please tell us why. This issue will automatically be closed in the near future if no further activity occurs. Thank you for all your contributions.