Skip to content

Commit 6b2c621

Browse files
committed
init
0 parents  commit 6b2c621

16 files changed

+5410
-0
lines changed

.editorconfig

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
root = true
2+
3+
[*]
4+
indent_style = space
5+
indent_size = 2
6+
end_of_line = lf
7+
charset = utf-8
8+
trim_trailing_whitespace = true
9+
insert_final_newline = true
10+
11+
[*.md]
12+
trim_trailing_whitespace = false

.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
dist

LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2017 EGOIST <[email protected]>
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

README.md

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
# rollup-plugin-postcss
2+
3+
[![NPM version](https://img.shields.io/npm/v/rollup-plugin-postcss.svg?style=flat)](https://npmjs.com/package/rollup-plugin-postcss) [![NPM downloads](https://img.shields.io/npm/dm/rollup-plugin-postcss.svg?style=flat)](https://npmjs.com/package/rollup-plugin-postcss) [![Build Status](https://img.shields.io/circleci/project/egoist/rollup-plugin-postcss/master.svg?style=flat)](https://circleci.com/gh/egoist/rollup-plugin-postcss)
4+
[![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat)](https://github.com/egoist/donate)
5+
6+
<img align="right" width="95" height="95"
7+
title="Philosopher’s stone, logo of PostCSS"
8+
src="http://postcss.github.io/postcss/logo.svg">
9+
10+
Seamless integration between [Rollup](https://github.com/rollup/rollup) and [PostCSS](https://github.com/postcss/postcss).
11+
12+
## Usage
13+
14+
```js
15+
import postcss from 'rollup-plugin-postcss'
16+
17+
export default {
18+
plugins: [
19+
postcss()
20+
]
21+
}
22+
```
23+
24+
### Extract CSS
25+
26+
```js
27+
postcss({
28+
use: [
29+
['css', { extract: true }],
30+
'postcss'
31+
]
32+
})
33+
```
34+
35+
### With Sass/Stylus/Less
36+
37+
First add relevant dependency:
38+
39+
```bash
40+
yarn add node-sass --dev
41+
# Now you can import `.sass` and `.scss` files in your library
42+
```
43+
44+
Then enable it in the plugin:
45+
46+
```js
47+
postcss({
48+
use: ['css', 'postcss', 'sass']
49+
})
50+
```
51+
52+
## Options
53+
54+
### use
55+
56+
Type: `name[]` `[name, options][]`
57+
58+
Use a loader.
59+
60+
## License
61+
62+
MIT &copy; [EGOIST](https://github.com/egoist)

circle.yml

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
2+
version: 2
3+
jobs:
4+
build:
5+
working_directory: ~/repo
6+
docker:
7+
- image: circleci/node:latest
8+
branches:
9+
ignore:
10+
- gh-pages # list of branches to ignore
11+
- /release\/.*/ # or ignore regexes
12+
steps:
13+
- checkout
14+
- restore_cache:
15+
key: dependency-cache-{{ checksum "yarn.lock" }}
16+
- run:
17+
name: install dependences
18+
command: yarn
19+
- save_cache:
20+
key: dependency-cache-{{ checksum "yarn.lock" }}
21+
paths:
22+
- ./node_modules
23+
- run:
24+
name: test
25+
command: yarn test:cov
26+
- run:
27+
name: upload coverage
28+
command: bash <(curl -s https://codecov.io/bash)

package.json

+64
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
{
2+
"name": "rollup-plugin-postcss",
3+
"version": "0.5.5",
4+
"description": "Seamless integration between Rollup and PostCSS",
5+
"main": "dist/index.common.js",
6+
"files": [
7+
"dist"
8+
],
9+
"scripts": {
10+
"test": "jest",
11+
"build": "bili",
12+
"lint": "xo"
13+
},
14+
"repository": {
15+
"type": "git",
16+
"url": "git+https://github.com/egoist/rollup-plugin-postcss.git"
17+
},
18+
"keywords": [
19+
"postcss",
20+
"rollup"
21+
],
22+
"author": "EGOIST <[email protected]>",
23+
"license": "MIT",
24+
"bugs": {
25+
"url": "https://github.com/egoist/rollup-plugin-postcss/issues"
26+
},
27+
"homepage": "https://github.com/egoist/rollup-plugin-postcss#readme",
28+
"devDependencies": {
29+
"babel-jest": "^22.0.4",
30+
"babel-preset-env": "^1.5.1",
31+
"bili": "^1.0.0",
32+
"eslint-config-rem": "^4.0.0",
33+
"jest": "^22.0.4",
34+
"rollup": "^0.53.3",
35+
"xo": "^0.18.2"
36+
},
37+
"dependencies": {
38+
"chalk": "^2.0.0",
39+
"concat-with-sourcemaps": "^1.0.5",
40+
"fs-extra": "^5.0.0",
41+
"postcss": "^6.0.1",
42+
"promise.series": "^0.2.0",
43+
"rollup-pluginutils": "^2.0.1",
44+
"style-inject": "^0.2.0"
45+
},
46+
"xo": {
47+
"extends": "rem",
48+
"envs": [
49+
"browser"
50+
]
51+
},
52+
"babel": {
53+
"presets": [
54+
[
55+
"env",
56+
{
57+
"targets": {
58+
"node": "current"
59+
}
60+
}
61+
]
62+
]
63+
}
64+
}

src/css-loader.js

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
export default {
2+
name: 'css',
3+
test: /\.css$/,
4+
process({ code, map }) {
5+
const shouldExtract = this.options.extract
6+
const shouldInject = typeof this.options.inject === 'undefined' ? true : this.options.inject
7+
let output = ''
8+
let extracted
9+
if (shouldExtract) {
10+
output += `export default {};`
11+
extracted = {
12+
code,
13+
id: this.id,
14+
map
15+
}
16+
} else {
17+
output += `var css = ${JSON.stringify(code)};\nexport default css;`
18+
}
19+
if (!shouldExtract && shouldInject) {
20+
output += '\n__$$styleInject(css);'
21+
}
22+
return {
23+
code: output,
24+
map,
25+
extracted
26+
}
27+
}
28+
}

src/index.js

+91
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import path from 'path'
2+
import { createFilter } from 'rollup-pluginutils'
3+
import Loaders from './loaders'
4+
import styleInject from 'style-inject'
5+
import fs from 'fs-extra'
6+
import Concat from 'concat-with-sourcemaps'
7+
8+
const EXT = ['.css', '.styl', '.sass', '.scss', '.less']
9+
10+
export default (options = {}) => {
11+
const filter = createFilter(options.include, options.exclude)
12+
13+
const inject = typeof options.inject === 'undefined' ? {} : options.inject
14+
15+
let use = options.use || ['css', 'postcss']
16+
use = use.reduce((res, rule) => {
17+
if (typeof rule === 'string') {
18+
rule = [rule]
19+
}
20+
const name = rule[0]
21+
const options = rule[1] || {}
22+
23+
if (name === 'css') {
24+
if (typeof options.inject === 'undefined') {
25+
options.inject = true
26+
}
27+
}
28+
29+
res[name] = options
30+
return res
31+
}, {})
32+
const loaders = new Loaders({
33+
use
34+
})
35+
36+
const extracted = []
37+
38+
return {
39+
name: 'postcss',
40+
41+
intro() {
42+
if (!use.css.inject || use.css.extract) return
43+
return styleInject.toString().replace('styleInject', '__$$styleInject')
44+
},
45+
46+
async transform(code, id) {
47+
if (!filter(id) || !loaders.isSupported(id)) {
48+
return null
49+
}
50+
51+
const res = await loaders.process({
52+
code,
53+
map: undefined,
54+
id
55+
})
56+
57+
if (use.css.extract) {
58+
extracted.push(res.extracted)
59+
return {
60+
code: res.code,
61+
map: { mappings: '' }
62+
}
63+
}
64+
65+
return {
66+
code: res.code,
67+
map: res.map
68+
}
69+
},
70+
71+
async onwrite(opts) {
72+
if (extracted.length === 0) return
73+
74+
const basename = path.basename(opts.file, path.extname(opts.file))
75+
const file = path.relative(process.cwd(), path.join(
76+
path.dirname(opts.file),
77+
basename + '.css'
78+
))
79+
const concat = new Concat(true, file, '\n')
80+
for (const res of extracted) {
81+
const relative = path.relative(process.cwd(), res.id)
82+
concat.add(relative, res.code, res.map)
83+
}
84+
const code = concat.content + `\n/*# sourceMappingURL=${basename}.css.map */`
85+
await Promise.all([
86+
fs.writeFile(file, code, 'utf8'),
87+
fs.writeFile(file + '.map', concat.sourceMap, 'utf8')
88+
])
89+
}
90+
}
91+
}

src/loaders.js

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import path from 'path'
2+
import postcss from 'postcss'
3+
import series from 'promise.series'
4+
import cssLoader from './css-loader'
5+
import postcssLoader from './postcss-loader'
6+
7+
export default class Loaders {
8+
constructor(options = {}) {
9+
this.use = options.use
10+
this.loaders = []
11+
12+
this.registerLoader(cssLoader)
13+
this.registerLoader(postcssLoader)
14+
}
15+
16+
registerLoader(loader) {
17+
this.loaders.push(loader)
18+
return this
19+
}
20+
21+
isSupported(filepath) {
22+
return this.loaders.some(loader => {
23+
return loader.test.test(filepath)
24+
})
25+
}
26+
27+
process({ code, map, id }) {
28+
const names = Object.keys(this.use)
29+
return series(names.slice().reverse().map(name => {
30+
const loader = this.getLoader(name)
31+
const options = this.use[name]
32+
const loaderContext = {
33+
options,
34+
id
35+
}
36+
return v => loader.process.call(loaderContext, v)
37+
}), { code, map })
38+
}
39+
40+
getLoader(name) {
41+
return this.loaders.find(loader => loader.name === name)
42+
}
43+
}
44+
45+
function localRequire(name) {
46+
return require(process.resolve('node_modules', name))
47+
}

src/postcss-loader.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import path from 'path'
2+
import postcss from 'postcss'
3+
4+
export default {
5+
name: 'postcss',
6+
test: /\.css$/,
7+
async process({ code, map }) {
8+
9+
const options = this.options || {}
10+
const plugins = options.plugins || []
11+
const processOpts = {
12+
from: path.relative(process.cwd(), this.id),
13+
to: path.relative(process.cwd(), this.id),
14+
map: {
15+
inline: false,
16+
annotation: false
17+
}
18+
}
19+
const res = await postcss(plugins).process(code, processOpts)
20+
21+
return {
22+
code: res.css,
23+
map: res.map.toString()
24+
}
25+
}
26+
}

0 commit comments

Comments
 (0)