https://github.com/elchininet/postcss-rtlcss-less-and-sass
Webpack configuration to use postcss-rtlcss with less and sass
https://github.com/elchininet/postcss-rtlcss-less-and-sass
css left-to-right less ltr postcss postcss-plugin postcss-rtlcss right-to-left rtl sass
Last synced: 6 months ago
JSON representation
Webpack configuration to use postcss-rtlcss with less and sass
- Host: GitHub
- URL: https://github.com/elchininet/postcss-rtlcss-less-and-sass
- Owner: elchininet
- Created: 2021-12-10T19:24:58.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2021-12-11T13:47:37.000Z (over 4 years ago)
- Last Synced: 2025-10-09T12:31:55.146Z (6 months ago)
- Topics: css, left-to-right, less, ltr, postcss, postcss-plugin, postcss-rtlcss, right-to-left, rtl, sass
- Language: JavaScript
- Homepage:
- Size: 73.2 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Webpack configurations to use postcss-rtlcss plugin with Less and Sass
These are minimum Webpack configurations to use [postcss-rtlcss plugin](https://github.com/elchininet/postcss-rtlcss) with [Less](https://lesscss.org/) and [Sass](https://sass-lang.com/)
### Using Less
```javascript
const postcssRTLCSS = require('postcss-rtlcss');
module.exports = {
... // other webpack configurations
module: {
rules: [
{
test: /\.less$/,
use: [
... // other loaders
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: [
postcssRTLCSS()
]
}
}
},
// Less loader must come before postcss-loader
'less-loader'
]
}
]
}
};
```
### Using Sass
```javascript
const postcssRTLCSS = require('postcss-rtlcss');
module.exports = {
... // other webpack configurations
module: {
rules: [
{
test: /\.s(c|a)ss$/,
use: [
... // other loaders
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: [
postcssRTLCSS()
]
}
}
},
// Sass loader must come before postcss-loader
'sass-loader'
]
}
]
}
};
```