Skip to content
This repository was archived by the owner on Jun 6, 2022. It is now read-only.

Commit 2a9c152

Browse files
author
Ҽ˿
committed
Modify the project name #3, update Gulp / Grunt document
1 parent f757fc2 commit 2a9c152

File tree

1 file changed

+41
-22
lines changed

1 file changed

+41
-22
lines changed

README.md

+41-22
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
# PostCSS Custom Selector [![Build Status](https://travis-ci.org/postcss/postcss-custom-selector.svg)](https://travis-ci.org/postcss/postcss-custom-selector)
1+
# PostCSS Custom Selectors [![Build Status](https://travis-ci.org/postcss/postcss-custom-selector.svg)](https://travis-ci.org/postcss/postcss-custom-selector)
22

33
> [PostCSS](https://github.com/postcss/postcss) 实现 [W3C CSS Extensions(Custom Selectors)](http://dev.w3.org/csswg/css-extensions/#custom-selectors) 的插件。
44
55

66

7-
## 安装(暂未发布)
7+
## 安装
88

9-
$ npm install postcss-custom-selector
9+
$ npm install postcss-custom-selectors
1010

1111
## 快速开始
1212

1313
```js
1414
// dependencies
1515
var fs = require('fs')
1616
var postcss = require('postcss')
17-
var selector = require('postcss-custom-selector')
17+
var selector = require('postcss-custom-selectors')
1818

1919
// css to be processed
2020
var css = fs.readFileSync('input.css', 'utf8')
2121

22-
// process css using postcss-custom-selector
22+
// process css using postcss-custom-selectors
2323
var output = postcss()
2424
.use(selector())
2525
.process(css)
@@ -118,31 +118,50 @@ a:link, a:visited {
118118
### Grunt
119119

120120
```js
121-
grunt.initConfig({
122-
postcss: {
123-
options: {
124-
processors: [require('postcss-custom-selector').postcss]
125-
},
126-
dist: {
127-
src: 'css/*.css'
121+
module.exports = function(grunt) {
122+
grunt.initConfig({
123+
pkg: grunt.file.readJSON('package.json'),
124+
postcss: {
125+
options: {
126+
processors: [
127+
require('autoprefixer-core')({ browsers: ['> 0%'] }).postcss, //Other plugin
128+
require('postcss-custom-selector')(),
129+
]
130+
},
131+
dist: {
132+
src: ['src/*.css'],
133+
dest: 'build/grunt.css'
134+
}
128135
}
129-
}
130-
});
136+
});
137+
138+
grunt.loadNpmTasks('grunt-contrib-uglify');
139+
grunt.loadNpmTasks('grunt-postcss');
131140

132-
grunt.loadNpmTasks('grunt-postcss');
141+
grunt.registerTask('default', ['postcss']);
142+
}
133143
```
134144

135145
### Gulp
136146

137147
```js
138148
var gulp = require('gulp');
149+
var rename = require('gulp-rename');
139150
var postcss = require('gulp-postcss');
140-
141-
gulp.task('css', function() {
142-
return gulp.src('./src/*.css')
143-
.pipe(postcss([require('postcss-custom-selector')]))
144-
.pipe(gulp.dest('./dest'));
151+
var selector = require('postcss-custom-selector')
152+
var autoprefixer = require('autoprefixer-core')
153+
154+
gulp.task('default', function () {
155+
var processors = [
156+
autoprefixer({ browsers: ['> 0%'] }), //Other plugin
157+
selector()
158+
];
159+
gulp.src('src/*.css')
160+
.pipe(postcss(processors))
161+
.pipe(rename('gulp.css'))
162+
.pipe(gulp.dest('build'))
145163
});
164+
gulp.watch('src/*.css', ['default']);
146165
```
147166

148167

@@ -186,11 +205,11 @@ section h1, article h1, aside h1, nav h1 {
186205
## 贡献
187206

188207
* 安装相关依赖模块
189-
* 尊重编码风格(安装)
208+
* 尊重编码风格(安装 [EditorConfig](http://editorconfig.org/)
190209
* 运行测试
191210

192211
```
193-
$ git clone https://github.com/postcss/postcss-custom-selector.git
212+
$ git clone https://github.com/postcss/postcss-custom-selectors.git
194213
$ git checkout -b patch
195214
$ npm install
196215
$ npm test

0 commit comments

Comments
 (0)