Skip to content
This repository was archived by the owner on Dec 21, 2021. It is now read-only.

Commit 5d4fc61

Browse files
jonathantnealjonathantneal
committed
5.0.0
1 parent e10ab0c commit 5d4fc61

File tree

8 files changed

+203
-136
lines changed

8 files changed

+203
-136
lines changed

‎.appveyor.yml‎

Lines changed: 0 additions & 18 deletions
This file was deleted.

‎.gitignore‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
node_modules
2-
index.*.js
2+
index.*.*
33
package-lock.json
44
*.log*
55
*.result.css
66
.*
7-
!.appveyor.yml
87
!.editorconfig
98
!.gitignore
109
!.rollup.js

‎.rollup.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@ import babel from 'rollup-plugin-babel';
33
export default {
44
input: 'index.js',
55
output: [
6-
{ file: 'index.cjs.js', format: 'cjs' },
7-
{ file: 'index.es.js', format: 'es' }
6+
{ file: 'index.cjs.js', format: 'cjs', sourcemap: true },
7+
{ file: 'index.es.mjs', format: 'es', sourcemap: true }
88
],
99
plugins: [
1010
babel({
1111
presets: [
12-
['env', { modules: false, targets: { node: 4 } }]
12+
['@babel/env', { modules: false, targets: { node: 6 } }]
1313
]
1414
})
1515
]

‎.travis.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
language: node_js
44

55
node_js:
6-
- 4
6+
- 6
77

88
install:
99
- npm install --ignore-scripts

‎CHANGELOG.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# Changes to PostCSS Dir Pseudo Class
22

3+
### 5.0.0 (September 17, 2018)
4+
5+
- Updated: Support for PostCSS v7+
6+
- Updated: Support for Node v6+
7+
- Updated: `postcss-selector-parser` to v5.0.0-rc.3+ (major)
8+
39
### 4.0.0 (May 8, 2018)
410

511
- Updated: `postcss-selector-parser` to v4.0.0 (major)

‎INSTALL.md‎

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
# Installing PostCSS Dir Pseudo Class
2+
3+
[PostCSS Dir Pseudo Class] runs in all Node environments, with special instructions for:
4+
5+
| [Node](#node) | [PostCSS CLI](#postcss-cli) | [Webpack](#webpack) | [Create React App](#create-react-app) | [Gulp](#gulp) | [Grunt](#grunt) |
6+
| --- | --- | --- | --- | --- | --- |
7+
8+
## Node
9+
10+
Add [PostCSS Dir Pseudo Class] to your project:
11+
12+
```bash
13+
npm install postcss-dir-pseudo-class --save-dev
14+
```
15+
16+
Use [PostCSS Dir Pseudo Class] to process your CSS:
17+
18+
```js
19+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
20+
21+
postcssDirPseudoClass.process(YOUR_CSS /*, processOptions, pluginOptions */);
22+
```
23+
24+
Or use it as a [PostCSS] plugin:
25+
26+
```js
27+
const postcss = require('postcss');
28+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
29+
30+
postcss([
31+
postcssDirPseudoClass(/* pluginOptions */)
32+
]).process(YOUR_CSS /*, processOptions */);
33+
```
34+
35+
## PostCSS CLI
36+
37+
Add [PostCSS CLI] to your project:
38+
39+
```bash
40+
npm install postcss-cli --save-dev
41+
```
42+
43+
Use [PostCSS Dir Pseudo Class] in your `postcss.config.js` configuration file:
44+
45+
```js
46+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
47+
48+
module.exports = {
49+
plugins: [
50+
postcssDirPseudoClass(/* pluginOptions */)
51+
]
52+
}
53+
```
54+
55+
## Webpack
56+
57+
Add [PostCSS Loader] to your project:
58+
59+
```bash
60+
npm install postcss-loader --save-dev
61+
```
62+
63+
Use [PostCSS Dir Pseudo Class] in your Webpack configuration:
64+
65+
```js
66+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
67+
68+
module.exports = {
69+
module: {
70+
rules: [
71+
{
72+
test: /\.css$/,
73+
use: [
74+
'style-loader',
75+
{ loader: 'css-loader', options: { importLoaders: 1 } },
76+
{ loader: 'postcss-loader', options: {
77+
ident: 'postcss',
78+
plugins: () => [
79+
postcssDirPseudoClass(/* pluginOptions */)
80+
]
81+
} }
82+
]
83+
}
84+
]
85+
}
86+
}
87+
```
88+
89+
## Create React App
90+
91+
Add [React App Rewired] and [React App Rewire PostCSS] to your project:
92+
93+
```bash
94+
npm install react-app-rewired react-app-rewire-postcss --save-dev
95+
```
96+
97+
Use [React App Rewire PostCSS] and [PostCSS Dir Pseudo Class] in your
98+
`config-overrides.js` file:
99+
100+
```js
101+
const reactAppRewirePostcss = require('react-app-rewire-postcss');
102+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
103+
104+
module.exports = config => reactAppRewirePostcss(config, {
105+
plugins: () => [
106+
postcssDirPseudoClass(/* pluginOptions */)
107+
]
108+
});
109+
```
110+
111+
## Gulp
112+
113+
Add [Gulp PostCSS] to your project:
114+
115+
```bash
116+
npm install gulp-postcss --save-dev
117+
```
118+
119+
Use [PostCSS Dir Pseudo Class] in your Gulpfile:
120+
121+
```js
122+
const postcss = require('gulp-postcss');
123+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
124+
125+
gulp.task('css', () => gulp.src('./src/*.css').pipe(
126+
postcss([
127+
postcssDirPseudoClass(/* pluginOptions */)
128+
])
129+
).pipe(
130+
gulp.dest('.')
131+
));
132+
```
133+
134+
## Grunt
135+
136+
Add [Grunt PostCSS] to your project:
137+
138+
```bash
139+
npm install grunt-postcss --save-dev
140+
```
141+
142+
Use [PostCSS Dir Pseudo Class] in your Gruntfile:
143+
144+
```js
145+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
146+
147+
grunt.loadNpmTasks('grunt-postcss');
148+
149+
grunt.initConfig({
150+
postcss: {
151+
options: {
152+
use: [
153+
postcssDirPseudoClass(/* pluginOptions */)
154+
]
155+
},
156+
dist: {
157+
src: '*.css'
158+
}
159+
}
160+
});
161+
```
162+
163+
[Gulp PostCSS]: https://github.com/postcss/gulp-postcss
164+
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
165+
[PostCSS]: https://github.com/postcss/postcss
166+
[PostCSS CLI]: https://github.com/postcss/postcss-cli
167+
[PostCSS Loader]: https://github.com/postcss/postcss-loader
168+
[PostCSS Dir Pseudo Class]: https://github.com/jonathantneal/postcss-dir-pseudo-class
169+
[React App Rewire PostCSS]: https://github.com/csstools/react-app-rewire-postcss
170+
[React App Rewired]: https://github.com/timarney/react-app-rewired

‎README.md‎

Lines changed: 10 additions & 102 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
[![NPM Version][npm-img]][npm-url]
44
[![CSS Standard Status][css-img]][css-url]
55
[![Build Status][cli-img]][cli-url]
6-
[![Windows Build Status][win-img]][win-url]
76
[![Support Chat][git-img]][git-url]
87

98
[PostCSS Dir Pseudo Class] lets you style by directionality using the `:dir()`
@@ -47,126 +46,35 @@ sometimes increase selector weight by one element (`html`).
4746

4847
## Usage
4948

50-
Add [PostCSS Dir Pseudo Class] to your build tool:
49+
Add [PostCSS Dir Pseudo Class] to your project:
5150

5251
```bash
5352
npm install postcss-dir-pseudo-class --save-dev
5453
```
5554

56-
#### Node
57-
5855
Use [PostCSS Dir Pseudo Class] to process your CSS:
5956

6057
```js
61-
import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
62-
63-
postcssDirPseudoClass.process(YOUR_CSS, /* processOptions */, /* pluginOptions */);
64-
```
65-
66-
#### PostCSS
58+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
6759

68-
Add [PostCSS] to your build tool:
69-
70-
```bash
71-
npm install postcss --save-dev
60+
postcssDirPseudoClass.process(YOUR_CSS /*, processOptions, pluginOptions */);
7261
```
7362

74-
Use [PostCSS Dir Pseudo Class] as a plugin:
63+
Or use it as a [PostCSS] plugin:
7564

7665
```js
77-
import postcss from 'gulp-postcss';
78-
import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
66+
const postcss = require('postcss');
67+
const postcssDirPseudoClass = require('postcss-dir-pseudo-class');
7968

8069
postcss([
8170
postcssDirPseudoClass(/* pluginOptions */)
82-
]).process(YOUR_CSS);
83-
```
84-
85-
#### Webpack
86-
87-
Add [PostCSS Loader] to your build tool:
88-
89-
```bash
90-
npm install postcss-loader --save-dev
91-
```
92-
93-
Use [PostCSS Dir Pseudo Class] in your Webpack configuration:
94-
95-
```js
96-
import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
97-
98-
module.exports = {
99-
module: {
100-
rules: [
101-
{
102-
test: /\.css$/,
103-
use: [
104-
'style-loader',
105-
{ loader: 'css-loader', options: { importLoaders: 1 } },
106-
{ loader: 'postcss-loader', options: {
107-
ident: 'postcss',
108-
plugins: () => [
109-
postcssDirPseudoClass(/* pluginOptions */)
110-
]
111-
} }
112-
]
113-
}
114-
]
115-
}
116-
}
71+
]).process(YOUR_CSS /*, processOptions */);
11772
```
11873

119-
#### Gulp
74+
[PostCSS Dir Pseudo Class] runs in all Node environments, with special instructions for:
12075

121-
Add [Gulp PostCSS] to your build tool:
122-
123-
```bash
124-
npm install gulp-postcss --save-dev
125-
```
126-
127-
Use [PostCSS Dir Pseudo Class] in your Gulpfile:
128-
129-
```js
130-
import postcss from 'gulp-postcss';
131-
import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
132-
133-
gulp.task('css', () => gulp.src('./src/*.css').pipe(
134-
postcss([
135-
postcssDirPseudoClass(/* pluginOptions */)
136-
])
137-
).pipe(
138-
gulp.dest('.')
139-
));
140-
```
141-
142-
#### Grunt
143-
144-
Add [Grunt PostCSS] to your build tool:
145-
146-
```bash
147-
npm install grunt-postcss --save-dev
148-
```
149-
150-
Use [PostCSS Dir Pseudo Class] in your Gruntfile:
151-
152-
```js
153-
import postcssDirPseudoClass from 'postcss-dir-pseudo-class';
154-
155-
grunt.loadNpmTasks('grunt-postcss');
156-
157-
grunt.initConfig({
158-
postcss: {
159-
options: {
160-
use: [
161-
postcssDirPseudoClass(/* pluginOptions */)
162-
]
163-
},
164-
dist: {
165-
src: '*.css'
166-
}
167-
}
168-
});
169-
```
76+
| [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) |
77+
| --- | --- | --- | --- | --- | --- |
17078

17179
## Options
17280

0 commit comments

Comments
 (0)