bjarneo / Cessie
Licence: mit
Transpile your CSS bundle to support CSS variables, calc, and future CSS for legacy browsers.
Stars: ✭ 81
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Cessie
Stylelint
A mighty, modern linter that helps you avoid errors and enforce conventions in your styles.
Stars: ✭ 9,350 (+11443.21%)
Mutual labels: scss, sass, less, postcss
Prejss
Get the power of PostCSS with plugins in your JSS styles. 🎨 Just put CSS into JS and get it as JSS object.
Stars: ✭ 238 (+193.83%)
Mutual labels: scss, sass, less, postcss
Vscode Stylelint
A Visual Studio Code extension to lint CSS/SCSS/Less with stylelint
Stars: ✭ 260 (+220.99%)
Mutual labels: scss, sass, less, postcss
Rollup Plugin Styles
🎨 Universal Rollup plugin for styles: PostCSS, Sass, Less, Stylus and more.
Stars: ✭ 116 (+43.21%)
Mutual labels: scss, sass, less, postcss
Bootstrap 4 Utilities
Bootstrap 4 utility classes in LESS CSS for Bootstrap 3 or any other projects.
Stars: ✭ 105 (+29.63%)
Mutual labels: scss, sass, less
Frasco
Quick starter for Jekyll including full setup for Sass, PostCSS, Autoprefixer, stylelint, Webpack, ESLint, imagemin, Browsersync, etc.
Stars: ✭ 123 (+51.85%)
Mutual labels: scss, sass, postcss
React Native Css Modules
Style React Native components using CSS, PostCSS, Sass, Less or Stylus.
Stars: ✭ 207 (+155.56%)
Mutual labels: sass, less, postcss
Fast
Develop, build, deploy, redeploy, and teardown frontend projects fast.
Stars: ✭ 126 (+55.56%)
Mutual labels: scss, sass, postcss
Compile Hero
🔰Visual Studio Code Extension For Compiling Language
Stars: ✭ 169 (+108.64%)
Mutual labels: scss, sass, less
Vertical Rhythm
Put some typographical vertical rhythm in your CSS. LESS, Stylus and SCSS/SASS versions included.
Stars: ✭ 83 (+2.47%)
Mutual labels: scss, sass, less
Reset Css
An unmodified* copy of Eric Meyer's CSS reset. PostCSS, webpack, Sass, and Less friendly.
Stars: ✭ 244 (+201.23%)
Mutual labels: sass, less, postcss
Gulp Starter Kit
A simple Gulp 4 Starter Kit for modern web development.
Stars: ✭ 134 (+65.43%)
Mutual labels: scss, sass, less
Reactql
Universal React+GraphQL starter kit: React 16, Apollo 2, MobX, Emotion, Webpack 4, GraphQL Code Generator, React Router 4, PostCSS, SSR
Stars: ✭ 1,833 (+2162.96%)
Mutual labels: sass, less, postcss
Webpack Encore
A simple but powerful API for processing & compiling assets built around Webpack
Stars: ✭ 1,975 (+2338.27%)
Mutual labels: sass, less, postcss
Style Resources Loader
CSS processor resources loader for webpack
Stars: ✭ 214 (+164.2%)
Mutual labels: scss, sass, less
Rollup Plugin Postcss
Seamless integration between Rollup and PostCSS.
Stars: ✭ 507 (+525.93%)
Mutual labels: sass, less, postcss
cessie
Transpile your CSS bundle to support CSS variables, calc, and future CSS for legacy browsers.
Features
- Uses PostCSS behind the scenes.
- Transpiles future CSS by using
postcss-preset-env
. - Transpiles CSS variables and calc by using
postcss-custom-properties
, andpostcss-calc
. - Can be used for all CSS bundles.
- Can transpile SCSS, SASS, and LESS.
- Can minify the output if not already minified.
- Watch mode.
- Source map.
Case
Example usage of this CLI would be cases where you don't have the power, or will to edit/write postcss/webpack config for your application. One of those examples are Create React App.
Create React App:
$ npm run build
$ cat build/static/css/*.chunk.css >> bundle.css
$ cessie bundle.css -o ie11.css
Install
$ npm i -g cessie
// Or use npx
$ npx cessie
Usage
$ cessie inputFile.css -o ie11.css
Usage
$ cessie <input> -o filename.css
Options
--out-file, -o Name of the out file
--minify, -m Minify css. Defaults to true.
--watch, -w Watch for file changes. Defaults to false.
--source-map, -s Generate source map. Defaults to true.
--import-from, -i Import CSS variables from file (https://github.com/postcss/postcss-custom-properties#importfrom)
--export-to, -e Export CSS variables to file (https://github.com/postcss/postcss-custom-properties#exportto)
Examples
$ cessie bundle.css -o ie11.css
Examples
// css/sass/less file
:root {
--color: white;
--padding: 10px;
}
div {
color: var(--color);
padding: calc(var(--padding) * 2);
}
// Run cessie with no minify
$ cessie my.css -o output.css -m false
// output.css
div {
color: white;
padding: 20px;
}
See more examples
Want features?
Please write an issue.
License
MIT © Bjarne Øverli
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].