Comments (6)
Hi there @COLABORATI, can you describe your setup to me? Are you using it via a plugin or as a library, or local or global command line?
from css-purge.
I think I can reproduce this issue.
In my setup I'm using node-sass
to compile scss files to css. Since I'm optimizing for http2 I'm creating bundles for every module on the page.
However, as a fallback I had to create a bundle that includes all code and just imported every single module bundle.
In my case bootstrap
gets included several times, but if I just use the node-sass
outputStyle compressed, it blews up my bundle like hell. So I found css-purge
to be a very good solution.
Here is my setup:
sass.render({
// ... sass options
}, (error, result) => {
if (error) { console.log(error) } else {
const css = result.css.toString(); // need this since result.css is a Buffer
cssPurge.purgeCSS(
css,
{
trim: false,
shorten: false,
format: false,
},
(purgeError, purgeResult) => {
if (purgeError) { console.log(purgeError) } else {
// ... write file
}
}
});
}
});
The css-purge options don't change result, doesn't matter which ones I choose. (e.g. last rule semicolons always get removed)
It even goes to the point where something gets formated in a way that leads to missing '}'s as the css parser states.
Error Message from css parser:
CSS Parser Error: probably have something funny in your CSS, change it then please try again.
Reason: @supports missing '}'
Line: 3
Column: 49
Filename: demo/test1.css
Which is odd, since it's a file in your package and I don't use it anywhere.
I'm using css-purge
3.0.10.
Hope you can help
from css-purge.
Hmm, I'll have to test and have a look at it, kinda busy right now though, lemme see if I can get to it this weekend.
from css-purge.
Hey guys, finally found the issue, it was the default vars, my bad, sorted.
You should be able to just update gulp-css-purge else uninstall and reinstall.
from css-purge.
I'm seeing this with css-purge 3.0.13 — just the plain node module, from the command line. I'm running CSS-PURGE against the output of my SCSS compilation, with the intent of looking over the diffs to identify duplications etc. and then going back to the SCSS source to fix them. Eliminating comments and whitespace and newlines and extra semicolons makes this difficult.
I tried explicitly specifying the default (?) config file, which appears to disable trim_comments
, trim_whitespace
, trim_breaklines, and
trim_last_semicolon, with
-f`, but the output is a minified single line without comments or trailing semicolons.
Per the trim
docs (“Only when its off can you turn on or off the other trim options”) I then tried setting "trim": "false"
, but the output was identical.
Am I misunderstanding the config? Am I doing something else wrong? Is the available node module out of date?
from css-purge.
@dmolesUC3 thanks for the heads up, I believe I sorted out the issue.
from css-purge.
Related Issues (20)
- css-purge not removing duplicated css styles HOT 1
- Wrong styles removed HOT 1
- Add short names option
- SyntaxError: Unexpected end of JSON input HOT 1
- bug: removing used code
- bug: the line that's after one with "important" is missed
- Feature Request: support stdin / stdout
- Output includes unwanted selectors
- [Bug] Inside config file, `reduce_declarations_file_location` has no effect
- Wrong file size after and saved HOT 1
- Is there an ES6 Modules (ESM) version of CSS Purge
- After purge, all the hover styles are removed.
- Handle/output CSS files with CRLF eol HOT 2
- Output multiple blank lines
- Is there a way to purge media queries of duplicated rules?
- Empty Rules With Border-Radius And Calc Function
- Can we stop using proccess.exit(1)?
- DOMException [SyntaxError]: 'undefined' is not a valid selector
- Invalid CSS Syntax after purge
- Module Not Found Error After Installing
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 css-purge.