giuseppeg / Styled Jsx Plugin Sass
Plugin to add Sass support to styled-jsx. Warning this is a Proof Of Concept plugin.
Stars: ✭ 115
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Styled Jsx Plugin Sass
Stylelint
A mighty, modern linter that helps you avoid errors and enforce conventions in your styles.
Stars: ✭ 9,350 (+8030.43%)
Mutual labels: scss, sass, css-in-js
Vscode Stylelint
A Visual Studio Code extension to lint CSS/SCSS/Less with stylelint
Stars: ✭ 260 (+126.09%)
Mutual labels: scss, sass, css-in-js
Fictoan
Mockups with markup — https://sujan-s.github.io/fictoan/
Stars: ✭ 114 (-0.87%)
Mutual labels: scss, sass
A11y.css
This CSS file intends to warn developers about possible risks and mistakes that exist in HTML code. It can also be used to roughly evaluate a site's quality by simply including it as an external stylesheet.
Stars: ✭ 1,277 (+1010.43%)
Mutual labels: scss, sass
Moo Css
模块化面向对象的css写法规范策略。适用于大中小型C端项目样式开发,旨在提高开发和维护效率。
Stars: ✭ 79 (-31.3%)
Mutual labels: sass, css-in-js
Bootstrap 4 Utilities
Bootstrap 4 utility classes in LESS CSS for Bootstrap 3 or any other projects.
Stars: ✭ 105 (-8.7%)
Mutual labels: scss, sass
Bitters
Bitters is maintained by the thoughtbot design team. It is funded by
thoughtbot, inc. and the names and logos for thoughtbot are
trademarks of thoughtbot, inc.
Stars: ✭ 1,398 (+1115.65%)
Mutual labels: scss, sass
Sass Vars Loader
Use Sass variables defined in Webpack config or in external Javascript or JSON files
Stars: ✭ 112 (-2.61%)
Mutual labels: scss, sass
Vertical Rhythm
Put some typographical vertical rhythm in your CSS. LESS, Stylus and SCSS/SASS versions included.
Stars: ✭ 83 (-27.83%)
Mutual labels: scss, sass
Cessie
Transpile your CSS bundle to support CSS variables, calc, and future CSS for legacy browsers.
Stars: ✭ 81 (-29.57%)
Mutual labels: scss, sass
Bourbon
Bourbon is maintained by the thoughtbot design team. It is funded
by thoughtbot, inc. and the names and logos for thoughtbot are
trademarks of thoughtbot, inc.
Stars: ✭ 9,065 (+7782.61%)
Mutual labels: scss, sass
Wordless
All the power of Pug, Sass, Coffeescript and WebPack in your WordPress theme. Stop writing themes like it's 1998.
Stars: ✭ 1,374 (+1094.78%)
Mutual labels: scss, sass
Light Blue Dashboard
🔥 Free and open-source admin dashboard template built with Bootstrap
Stars: ✭ 110 (-4.35%)
Mutual labels: scss, sass
Bootstrap 4 Sass Gulp 4 Boilerplate
A Bootstrap 4.5.2 boilerplate with font-awesome, sass, gulp 4 tasks
Stars: ✭ 103 (-10.43%)
Mutual labels: scss, sass
styled-jsx-plugin-sass
Use Sass with styled-jsx 💥
⚠️ This plugin is not actively being maintained. If you want me to work on it please consider donating.
Usage
Install the package first.
npm install --save-dev styled-jsx-plugin-sass
Install the node-sass
version you need (it is a peer dependency).
npm install --save-dev node-sass
Next, add styled-jsx-plugin-sass
to the styled-jsx
's plugins
in your babel configuration:
{
"plugins": [
[
"styled-jsx/babel",
{ "plugins": ["styled-jsx-plugin-sass"] }
]
]
}
Node-sass options
Node-sass can be configured using sassOptions
. This is useful for setting options such as includePaths
or precision
.
{
"plugins": [
[
"styled-jsx/babel",
{
"plugins": [
["styled-jsx-plugin-sass", {
"sassOptions": {
"includePaths": ["./styles"],
"precision": 2
}
}
]
]
}
]
]
}
Notes
styled-jsx-plugin-sass
uses styled-jsx
's plugin system which is supported from version 2.
Read more on their repository for further info.
License
MIT
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].