Comments (11)
I don't see any options to generate a sourcemap using the scssphp library. It does look like there is an option to add the original scss line numbers though.
Is any one interested in this? Anyone want to submit a pull request?
from wp-scss.
it is working for me in class-wp-scss.php@63
$map = basename($out) . '.map';
$scssc->setSourceMap(2);
$scssc->setSourceMapOptions(array(
'sourceMapWriteTo' => $instance->css_dir . $map, // absolute path to a file to write the map to
'sourceMapURL' => $map, // url of the map
// 'sourceMapFilename' => $in, // an optional name of the generated code that this source map is associated with.
'sourceMapBasepath' => rtrim(ABSPATH, '/'), // base path for filename normalization
'sourceRoot' => '/', // This value is prepended to the individual entries in the 'source' field.
// 'sourceMapRootpath' => '', // base path for filename normalization
// 'outputSourceFiles' => true, // output source contents?
));
$css = $scssc->compile(file_get_contents($in), $in);
N.B.
the line 63
$css = $scssc->compile(file_get_contents($in));
should be or deleted or commented.
N.B.
OLD VERSION of firefox developer edition has currently a bug with sourcemap files and htaccess authentication.
from wp-scss.
@iannacone Thanks for your help with this. Source maps have been added in the latest version: f2650d1
from wp-scss.
Did you figure this out @neocamel?
I've just started using this and would also love a sourcemap.
from wp-scss.
Unfortunately no, I don't believe I've figured that out. I'm still relatively new to grunt so I'm not really able to create my own solutions yet.
from wp-scss.
also need a sourcemap. any information on how to integrate one would be great
from wp-scss.
I was able to view the lines comments by adding this on line 35 of class-wp-scss.php:
$scssc->setLineNumberStyle(Compiler::LINE_COMMENTS);
We would need a back office option to enable this feature (or they are only displayed in debug mode). However, these comments lines do not allow an effective debug in Chrome.
The best solution is to add a sourcemap.css
from wp-scss.
That's great! If you want to submit a pull request, we'll get it in right away. If not, we'll work on it for the next release.
from wp-scss.
I do not think this is the right solution. Having sourcemap will make debugging easier because it allows to use Chrome developer tools.
There is a discussion on the leafo/scssphp repository about sourcemap: leafo/scssphp#135 . But it seems that it doesn't evolve so much.
There is also a WIP branch there https://github.com/leafo/scssphp/tree/wip/source-maps but I'm not able to generate sourcemap with it.
The WP-SCSS plugin is really useful, but without sourcemap, I can't put this in my workflow
from wp-scss.
I recently learned about source maps myself and found this link which isn't posted here yet. Mabye it will help creating this feature in this plugin.
from wp-scss.
@iannacone mod works perfectly, thanks! - @brrn can you please get this added officially?
from wp-scss.
Related Issues (20)
- Configure plugin via define or json HOT 2
- CSS rule filter: invert() creates error message HOT 2
- Settings are not getting stored HOT 3
- Improving performance HOT 5
- Add a version to the compiled scss file
- Source Map Issue HOT 4
- File Permission Error, permission denied. Please make the cache directory writable. HOT 7
- Update scssphp to v1.10.0 HOT 2
- ":not()" is crashing Wordpress HOT 6
- Can not change colors HOT 2
- Conflicting with any kind of infinite scroll plugin. HOT 2
- Wrong path in header generated HOT 2
- Warning: Array to string conversion HOT 3
- Version 3.0 Crashed my entire site - (Resolved) HOT 33
- Error with 3.0 Update: Uncaught Error: Class "ScssPhp\ScssPhp\Block\MediaBlock" #630 HOT 4
- Looking for a new maintainer HOT 7
- What would a Premium version of WP-SCSS look like? HOT 2
- 4.0.2 causing error in commented out SCSS HOT 2
- PHP 8.2 Creation of dynamic property ... is deprecated HOT 2
- PHP Warning: No such file or directory HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from wp-scss.