shinnn / broccoli-clean-css Goto Github PK
View Code? Open in Web Editor NEWA Broccoli plugin to minify CSS with clean-css
License: MIT License
A Broccoli plugin to minify CSS with clean-css
License: MIT License
clean-css
has started implementing source maps on the f/source-maps branch. I think we should implement this in the plugin too.
I have already started some work on this, and I will update as soon as I have something that's useable.
I realize you may be hesitant to override defaults provided by the clean-css upstream, but I'm wondering if it would actually make sense for this plugin to default the rebase
option to false
.
I ran the following code in my Brocfile.js
, expecting that minifying the CSS would preserve its semantics:
if (production) {
outputNode = new BroccoliCleanCss(outputNode);
}
This almost worked, except that clean-css rewrote all image references in styles/foo.css
as if they were relative to the outputNode
root rather than the styles/
directory.
I'm not entirely sure why clean-css defaults its rebase
feature to true
, but perhaps it might make sense for this plugin to default it to false
?
I'm happy to submit a pull request if you think that this is a reasonable change.
This change would probably warrant a version bump to 3.0.0, since it breaks the default behavior.
It appears between 1.0.0 and 1.1.0 the options.strict
, which would throw if there was an error and strict
was truthy (false by default), was removed:
https://github.com/shinnn/broccoli-clean-css/blob/v1.0.0/index.js#L42-L44
This results in builds failing since they started pulling in newer versions of the lib, see: ember-cli/ember-cli-preprocess-registry#8
Would you be willing to accept a PR to bring it back for 1.x and in 2.x revisit removing it to respect semver?
Thanks, and great plugin ๐
Currently relativeTo
option and root
option are relative to the source tree.
For example,
var cleanCSS = require('broccoli-clean-css');
var tree = cleanCSS('src');
module.exports = tree;
In such a case, relativeTo
option is automatically set to src
.
I think this default behavior is correct. The problem occurs when relativeTo
or root
are set by a user.
For example, when a user want to set relativeTo
option to src/nested
, how should this plugin set the option?
relativeTo
option to src/nested
(doesn't consider the default path)relativeTo
option to nested
(relative to the default path)Which is the most suitable way?
@jakubpawlowicz I want to hear your opinion.
https://ci.appveyor.com/project/ShinnosukeWatanabe/broccoli-clean-css
i dont believe explicit paths will work in windows: https://github.com/shinnn/broccoli-clean-css/blob/master/package.json#L11 node_modules/.bin/istanbul
maybe there is a trick?
A quick fix, would be to disable coverage for windows, and let the posix suite handle that.
It's much faster the broccoli-filter, we have plans to upstream the work. @joliss is thinkin on how to elegantly incorporate some of the ideas. At which time, we will re-merge the two projects.
Given projects such as: https://gist.github.com/workmanw/fdf85772fb8e61bfbeb8
BPF will easily reduce the 86ms rebuild time to 5-10ms (or better)
If no one beats me to it, later this week I will try to make the update myself.
Some examples doing similar upgrade (maybe i get lucky and someone beats me to it):
I am using ember-cli 2.18.1 and would like to exclude some files from the CSS minification with the following options:
minifyCSS: {
enabled: true,
sourceMap: true,
options: {
exclude: [ "**/filexy.css" ]
}
},
Apparently an option "exclude" is not available in broccoli-clean-css.
This would be very handy.
In contrast the JS minification has an option to exclude files:
minifyJS: {
enabled: true,
sourceMap: true,
options: {
exclude: [ "**/filexy.js" ]
}
},
Hi!
Is there any explanation why you set the file extension only as css: https://github.com/shinnn/broccoli-clean-css/blob/master/index.js#L23 ?
I'm using this package with ember-cli and I'm trying to create the output file as name.min.css and with that restriction I couldn't.
Did I miss anything?
Thanks!
When using the following:
background-color: #ffffffe6;
With minification broccoli-clean-css seems to turn this into:
background-color: #fffe6;
Which Chrome reports as an invalid property.
Tested using latest Ember build with clean project.
It was released yesterday and here are upgrade instructions: https://github.com/jakubpawlowicz/clean-css#how-to-upgrade-clean-css-from-2x-to-3x
I am not sure if this is an issue in this repo or Ember-CLI. I am using Ember-CLI and local css works fine but prod is broken when css is minified. My app.scss file below:
div.md {
@import "components/materializecss";
}
div.found {
@import "foundation";
}
This nesting allows separate areas of the app to be exclusively MD or Found styles. However, after minification none of the styles work correctly.
@shinnn In old versions of broccoli-clean-css
relativeTo
can be set to anything. However in newer versions it is always relative to the source directory.
Libraries that use the old behaviour are blocked from upgrading because of this (ember-cli/ember-cli-preprocess-registry#6)
Can we get some way to bypass this forced rebasing?
Hi there
You broke the hole world with this commit 9e560a5
I get ReferenceError: Promise is not defined
on new builds using version @1.1.0
, with the version @1.0.0
, all was fine
since we reference ^1.0.0
in our packages.json
, new build started to fails since you released 1.1.0
it is always a best practice to raise the major version of the module if it introduces breaking changes
info
node version: v0.10.30
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.