From 5c1c10834fa072785a9d73a0e5cfe75318b1f9c3 Mon Sep 17 00:00:00 2001
From: Yury Timofeev
Date: Mon, 16 Jul 2018 18:00:55 +0300
Subject: [PATCH 01/27] docs(README): clarify `path` option description
(`options.config.path`) (#371)
---
README.md | 9 +++++++--
1 file changed, 7 insertions(+), 2 deletions(-)
diff --git a/README.md b/README.md
index a3465703..b53e640b 100644
--- a/README.md
+++ b/README.md
@@ -137,7 +137,7 @@ If you use JS styles without the [`postcss-js`][postcss-js] parser, add the `exe
|Name|Type|Default|Description|
|:--:|:--:|:-----:|:----------|
-|[`path`](#path)|`{String}`|`undefined`|PostCSS Config Path|
+|[`path`](#path)|`{String}`|`undefined`|PostCSS Config Directory|
|[`context`](#context)|`{Object}`|`undefined`|PostCSS Config Context|
#### `Path`
@@ -146,18 +146,23 @@ You can manually specify the path to search for your config (`postcss.config.js`
> ⚠️ Otherwise it is **unnecessary** to set this option and is **not** recommended
+> ⚠️ Note that you **can't** use a **filename** other than the [supported config formats] (e.g `.postcssrc.js`, `postcss.config.js`), this option only allows you to manually specify the **directory** where config lookup should **start** from
+
**webpack.config.js**
```js
{
loader: 'postcss-loader',
options: {
config: {
- path: 'path/to/postcss.config.js'
+ path: 'path/to/.config/' ✅
+ path: 'path/to/.config/css.config.js' ❌
}
}
}
```
+[supported config formats]: https://github.com/michael-ciniawsky/postcss-load-config#usage
+
#### `Context (ctx)`
|Name|Type|Default|Description|
From 060e3cbb216dcf24ccac13528a1b06b9aaf4aa2d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Peter=20M=C3=BCller?=
Date: Fri, 27 Jul 2018 02:20:56 +0200
Subject: [PATCH 02/27] docs(README): resolve http redirects and use https
(#377)
---
README.md | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
index b53e640b..89f47b96 100644
--- a/README.md
+++ b/README.md
@@ -8,7 +8,7 @@
PostCSS Loader
- Loader for webpack to process CSS with PostCSS
+ Loader for webpack to process CSS with PostCSS
Install
@@ -356,7 +356,7 @@ or use [postcss-modules] instead of `css-loader`.
[`importLoaders`]: https://github.com/webpack-contrib/css-loader#importloaders
[cannot be used]: https://github.com/webpack/css-loader/issues/137
[CSS Modules]: https://github.com/webpack/css-loader#css-modules
-[postcss-modules]: https://github.com/outpunk/postcss-modules
+[postcss-modules]: https://github.com/css-modules/postcss-modules
### `CSS-in-JS`
@@ -461,7 +461,7 @@ module.exports = {
[deps]: https://david-dm.org/postcss/postcss-loader.svg
[deps-url]: https://david-dm.org/postcss/postcss-loader
-[tests]: http://img.shields.io/travis/postcss/postcss-loader.svg
+[tests]: https://img.shields.io/travis/postcss/postcss-loader.svg
[tests-url]: https://travis-ci.org/postcss/postcss-loader
[cover]: https://coveralls.io/repos/github/postcss/postcss-loader/badge.svg
From e44fed65402c6ce456aab9cb15234cf280298383 Mon Sep 17 00:00:00 2001
From: Alexander Ergin
Date: Wed, 1 Aug 2018 21:08:14 +0500
Subject: [PATCH 03/27] docs(README): update extract CSS example (#378)
---
README.md | 21 +++++++++++----------
1 file changed, 11 insertions(+), 10 deletions(-)
diff --git a/README.md b/README.md
index 89f47b96..2dbf2d62 100644
--- a/README.md
+++ b/README.md
@@ -401,29 +401,30 @@ export default {
### [Extract CSS][ExtractPlugin]
-[ExtractPlugin]: https://github.com/webpack-contrib/extract-text-webpack-plugin
+[ExtractPlugin]: https://github.com/webpack-contrib/mini-css-extract-plugin
**webpack.config.js**
```js
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const devMode = process.env.NODE_ENV !== 'production';
module.exports = {
module: {
rules: [
{
test: /\.css$/,
- use: ExtractTextPlugin.extract({
- fallback: 'style-loader',
- use: [
- { loader: 'css-loader', options: { importLoaders: 1 } },
- 'postcss-loader'
- ]
- })
+ use: [
+ devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
+ 'css-loader',
+ 'postcss-loader',
+ ]
}
]
},
plugins: [
- new ExtractTextPlugin('[name].css')
+ new MiniCssExtractPlugin({
+ filename: devMode ? '[name].css' : '[name].[hash].css',
+ })
]
}
```
From 5e2bca9f34ff93e99f8bac744960371026d2587d Mon Sep 17 00:00:00 2001
From: Eduard Kyvenko
Date: Fri, 3 Aug 2018 15:53:20 +0200
Subject: [PATCH 04/27] docs(README): replace `postcss-cssnext` with
`postcss-preset-env` (#379)
---
README.md | 7 +++----
1 file changed, 3 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
index 2dbf2d62..6a25d4f1 100644
--- a/README.md
+++ b/README.md
@@ -39,7 +39,7 @@ module.exports = {
parser: 'sugarss',
plugins: {
'postcss-import': {},
- 'postcss-cssnext': {},
+ 'postcss-preset-env': {},
'cssnano': {}
}
}
@@ -179,8 +179,7 @@ module.exports = ({ file, options, env }) => ({
parser: file.extname === '.sss' ? 'sugarss' : false,
plugins: {
'postcss-import': { root: file.dirname },
- 'postcss-cssnext': options.cssnext ? options.cssnext : false,
- 'autoprefixer': env === 'production' ? options.autoprefixer : false,
+ 'postcss-preset-env': options.presetEnv ? options.presetEnv : false,
'cssnano': env === 'production' ? options.cssnano : false
}
})
@@ -212,7 +211,7 @@ module.exports = ({ file, options, env }) => ({
ident: 'postcss',
plugins: (loader) => [
require('postcss-import')({ root: loader.resourcePath }),
- require('postcss-cssnext')(),
+ require('postcss-preset-env')(),
require('autoprefixer')(),
require('cssnano')()
]
From 0bb835cd487b7583d359ff47a59a1c638ae9fd7e Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 03:51:58 +0200
Subject: [PATCH 05/27] ci(package): run tests in an explicit environment
(`jest --env=node`) (#382)
---
package.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/package.json b/package.json
index 91f7872d..4d26c130 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,7 @@
},
"scripts": {
"lint": "standard --env jest",
- "test": "jest --verbose --coverage",
+ "test": "jest --env=node --verbose --coverage",
"docs": "jsdoc2md lib/index.js > LOADER.md",
"clean": "rm -rf coverage test/outputs",
"release": "standard-version"
From 6f10898e5c8ca22ca84f4279dd91c2688a21f5b5 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 03:59:17 +0200
Subject: [PATCH 06/27] ci(appveyor): readd Appveyor CI (#381)
---
appveyor.yml | 21 +++++++++++++++++++++
1 file changed, 21 insertions(+)
create mode 100644 appveyor.yml
diff --git a/appveyor.yml b/appveyor.yml
new file mode 100644
index 00000000..9b3b9f50
--- /dev/null
+++ b/appveyor.yml
@@ -0,0 +1,21 @@
+init:
+ - git config --global core.autocrlf input
+
+build: 'off'
+
+matrix:
+ fast_finish: true
+
+environment:
+ matrix:
+ - nodejs_version: '10'
+ - nodejs_version: '8'
+ - nodejs_version: '6'
+
+install:
+ - ps: Install-Product node $env:nodejs_version x64
+ - npm i -g npm
+ - npm i
+
+test_script:
+ - npm t
From 8ef443fe7555bf928585691003473db7cd6a2e35 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 04:23:26 +0200
Subject: [PATCH 07/27] ci(travis): build stages
---
.travis.yml | 22 +++++++++++++++++-----
1 file changed, 17 insertions(+), 5 deletions(-)
diff --git a/.travis.yml b/.travis.yml
index 04451558..5262a9a8 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,13 +1,25 @@
language: node_js
-node_js:
- - stable
- - lts/*
- - 6
+jobs:
+ fast_finish: true
+ include:
+ - stage: Lint
+ env: SCRIPT=lint
+ node_js: 'stable'
+ - &test
+ stage: 'Test'
+ env: SCRIPT=test
+ node_js: 'stable'
+ - <<: *test
+ node_js: 'lts/*'
+ - <<: *test
+ node_js: 6
+
+script: npm run $SCRIPT
after_success:
- npm i coveralls
- - cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js
+ - cat ./coverage/lcov.info | $(npm bin)/coveralls
notifications:
email: false
From 877281480682c3a056c319870927f850e3c29648 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 06:35:34 +0200
Subject: [PATCH 08/27] style(standard): fix linting issues
---
lib/index.js | 2 +-
test/fixtures/config/context/plugin.js | 8 ++---
test/loader.test.js | 18 ++++++-----
test/options/config.test.js | 41 +++++++++++++-------------
test/options/exec.test.js | 14 ++++-----
test/options/parser.test.js | 16 +++++-----
test/options/plugins.test.js | 32 ++++++++++----------
test/options/sourceMap.test.js | 24 +++++++--------
test/options/stringifier.test.js | 16 +++++-----
test/options/syntax.test.js | 16 +++++-----
10 files changed, 95 insertions(+), 92 deletions(-)
diff --git a/lib/index.js b/lib/index.js
index 623ff184..5dc545e2 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -90,7 +90,7 @@ module.exports = function loader (css, map, meta) {
}
}
- rc.ctx.webpack = this;
+ rc.ctx.webpack = this
return postcssrc(rc.ctx, rc.path)
}).then((config) => {
diff --git a/test/fixtures/config/context/plugin.js b/test/fixtures/config/context/plugin.js
index 027eb431..17164458 100644
--- a/test/fixtures/config/context/plugin.js
+++ b/test/fixtures/config/context/plugin.js
@@ -5,11 +5,11 @@ const postcss = require('postcss')
// This plugin creates asset file in webpack compilation
module.exports = postcss.plugin('plugin', (ctx) => {
ctx.webpack._compilation.assets['asset.txt'] = {
- source() {
- return '123';
+ source () {
+ return '123'
},
- size() {
- return 0;
+ size () {
+ return 0
}
}
})
diff --git a/test/loader.test.js b/test/loader.test.js
index c7f1cf7d..d3296840 100644
--- a/test/loader.test.js
+++ b/test/loader.test.js
@@ -2,7 +2,7 @@
const webpack = require('./helpers/compiler')
const { loader } = require('./helpers/compilation')
-const { copyFile, deleteFile } = require('./helpers/fs');
+const { copyFile, deleteFile } = require('./helpers/fs')
describe('Loader', () => {
test('Default', () => {
@@ -15,11 +15,11 @@ describe('Loader', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: black }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: black }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
describe('Watching', () => {
@@ -40,7 +40,7 @@ describe('Loader', () => {
options: {
plugins: [
require('postcss-import')
- ],
+ ]
}
}
}
@@ -66,7 +66,7 @@ describe('Loader', () => {
const { err, src } = loader(stats)
expect(src).toMatchSnapshot()
- expect(src).toEqual("module.exports = \"a { color: black }\\n\"")
+ expect(src).toEqual('module.exports = "a { color: black }\\n"')
expect(err.length).toEqual(0)
return close()
@@ -77,6 +77,10 @@ describe('Loader', () => {
const options = {
watch (err, stats, close) {
+ if (err) {
+ throw err
+ }
+
steps[step](stats, close)
step++
diff --git a/test/options/config.test.js b/test/options/config.test.js
index cc98c00c..9bb52a31 100644
--- a/test/options/config.test.js
+++ b/test/options/config.test.js
@@ -10,11 +10,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Config - Path - {String}', () => {
@@ -27,11 +27,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: black }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: black }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Config - Context - {Object}', () => {
@@ -47,14 +47,13 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
-
test('Config - Context - {Object} - with ident', () => {
const config = {
loader: {
@@ -69,11 +68,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Pass loader object to config context', () => {
@@ -88,11 +87,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const assets = stats.compilation.assets;
- const expectedAssetName = 'asset.txt';
+ const assets = stats.compilation.assets
+ const expectedAssetName = 'asset.txt'
- expect(expectedAssetName in assets).toBeTruthy();
- expect(assets[expectedAssetName].source()).toBe('123');
+ expect(expectedAssetName in assets).toBeTruthy()
+ expect(assets[expectedAssetName].source()).toBe('123')
})
})
})
diff --git a/test/options/exec.test.js b/test/options/exec.test.js
index 33795b98..ac61490e 100644
--- a/test/options/exec.test.js
+++ b/test/options/exec.test.js
@@ -15,11 +15,11 @@ describe('Options', () => {
}
return webpack('jss/exec/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a {\\n color: green\\n}\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a {\\n color: green\\n}"')
+ expect(src).toMatchSnapshot()
+ })
})
test('JSS - {String}', () => {
@@ -32,9 +32,9 @@ describe('Options', () => {
}
return webpack('jss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toMatchSnapshot()
- })
+ expect(src).toMatchSnapshot()
+ })
})
})
diff --git a/test/options/parser.test.js b/test/options/parser.test.js
index 7c4bde78..58e3ecf4 100644
--- a/test/options/parser.test.js
+++ b/test/options/parser.test.js
@@ -14,11 +14,11 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a {\\n color: black\\n}\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Parser - {Object}', () => {
@@ -32,10 +32,10 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a {\\n color: black\\n}\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
})
diff --git a/test/options/plugins.test.js b/test/options/plugins.test.js
index 32293cc6..bc98ad3c 100644
--- a/test/options/plugins.test.js
+++ b/test/options/plugins.test.js
@@ -15,11 +15,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Plugins - {Object}', () => {
@@ -33,11 +33,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Plugins - {Function} - {Array}', () => {
@@ -51,11 +51,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Plugins - {Function} - {Object}', () => {
@@ -69,10 +69,10 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
})
diff --git a/test/options/sourceMap.test.js b/test/options/sourceMap.test.js
index 873e786d..3669127a 100644
--- a/test/options/sourceMap.test.js
+++ b/test/options/sourceMap.test.js
@@ -15,18 +15,18 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\"")
- expect(src).toMatchSnapshot()
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
+ expect(src).toMatchSnapshot()
- const map = loader(stats).map
+ const map = loader(stats).map
- map.file = path.relative(__dirname, map.file)
- map.sources = map.sources.map((src) => path.relative(__dirname, src))
+ map.file = path.relative(__dirname, map.file)
+ map.sources = map.sources.map((src) => path.relative(__dirname, src))
- expect(map).toMatchSnapshot()
- })
+ expect(map).toMatchSnapshot()
+ })
})
test('Sourcemap - {String}', () => {
@@ -39,10 +39,10 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a { color: rgba(255, 0, 0, 1.0) }\\n\\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QvZml4dHVyZXMvY3NzL3N0eWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxJQUFJLDJCQUFZLEVBQUUiLCJmaWxlIjoidGVzdC9maXh0dXJlcy9jc3Mvc3R5bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYSB7IGNvbG9yOiBibGFjayB9XG4iXX0= */\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n\\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QvZml4dHVyZXMvY3NzL3N0eWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxJQUFJLDJCQUFZLEVBQUUiLCJmaWxlIjoidGVzdC9maXh0dXJlcy9jc3Mvc3R5bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYSB7IGNvbG9yOiBibGFjayB9XG4iXX0= */"')
+ expect(src).toMatchSnapshot()
+ })
})
})
diff --git a/test/options/stringifier.test.js b/test/options/stringifier.test.js
index f4f450be..bf94b46a 100644
--- a/test/options/stringifier.test.js
+++ b/test/options/stringifier.test.js
@@ -14,11 +14,11 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a color: black\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a color: black\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Stringifier - {Object}', () => {
@@ -32,10 +32,10 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a color: black\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a color: black\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
})
diff --git a/test/options/syntax.test.js b/test/options/syntax.test.js
index 597c58c5..27d152cc 100644
--- a/test/options/syntax.test.js
+++ b/test/options/syntax.test.js
@@ -14,11 +14,11 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a\\n color: black\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a\\n color: black\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
test('Syntax - {Object}', () => {
@@ -32,10 +32,10 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const src = loader(stats).src
- expect(src).toEqual("module.exports = \"a\\n color: black\\n\"")
- expect(src).toMatchSnapshot()
- })
+ expect(src).toEqual('module.exports = "a\\n color: black\\n"')
+ expect(src).toMatchSnapshot()
+ })
})
})
From 114db125074a80db436c25323683c94f5d7aa741 Mon Sep 17 00:00:00 2001
From: Eduard Kyvenko
Date: Sat, 4 Aug 2018 16:27:09 +0200
Subject: [PATCH 09/27] docs(README): add autoprefixing example (#380)
---
README.md | 31 +++++++++++++++++++++++++++----
1 file changed, 27 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
index 6a25d4f1..f7546968 100644
--- a/README.md
+++ b/README.md
@@ -179,7 +179,7 @@ module.exports = ({ file, options, env }) => ({
parser: file.extname === '.sss' ? 'sugarss' : false,
plugins: {
'postcss-import': { root: file.dirname },
- 'postcss-preset-env': options.presetEnv ? options.presetEnv : false,
+ 'postcss-preset-env': options['postcss-preset-env'] ? options['postcss-preset-env'] : false,
'cssnano': env === 'production' ? options.cssnano : false
}
})
@@ -192,9 +192,8 @@ module.exports = ({ file, options, env }) => ({
options: {
config: {
ctx: {
- cssnext: {...options},
+ 'postcss-preset-env': {...options},
cssnano: {...options},
- autoprefixer: {...options}
}
}
}
@@ -212,7 +211,6 @@ module.exports = ({ file, options, env }) => ({
plugins: (loader) => [
require('postcss-import')({ root: loader.resourcePath }),
require('postcss-preset-env')(),
- require('autoprefixer')(),
require('cssnano')()
]
}
@@ -332,6 +330,31 @@ within the CSS directly as an annotation comment.
}
```
+### Autoprefixing
+
+**webpack.config.js**
+```js
+{
+ test: /\.css$/,
+ use: [
+ 'style-loader',
+ 'css-loader',
+ {
+ loader: 'postcss-loader',
+ options: {
+ ident: 'postcss',
+ plugins: [
+ require('autoprefixer')({...options}),
+ ...,
+ ]
+ }
+ }
+ ]
+}
+```
+
+> :warning: [`postcss-preset-env`](https://github.com/csstools/postcss-preset-env) includes [`autoprefixer`](https://github.com/postcss/autoprefixer), so adding it separately is not necessary if you already use the preset.
+
### `CSS Modules`
This loader [cannot be used] with [CSS Modules] out of the box due
From daa0da8a7492ccc11c6735855a9c34cfd2d3ca54 Mon Sep 17 00:00:00 2001
From: Patrick Abkarian
Date: Sat, 4 Aug 2018 06:45:35 +0200
Subject: [PATCH 10/27] chore(package): update `postcss` v6.0.0...7.0.0
(`dependencies`) (#375)
BREAKING CHANGE: requires `node >= v6.0.0`
---
package.json | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/package.json b/package.json
index 4d26c130..bbeaf8da 100644
--- a/package.json
+++ b/package.json
@@ -7,11 +7,11 @@
"lib"
],
"engines": {
- "node": ">= 4"
+ "node": ">= 6"
},
"dependencies": {
"loader-utils": "^1.1.0",
- "postcss": "^6.0.0",
+ "postcss": "^7.0.0",
"postcss-load-config": "^2.0.0",
"schema-utils": "^0.4.0"
},
@@ -20,7 +20,7 @@
"jsdoc-to-markdown": "^4.0.0",
"memory-fs": "^0.4.0",
"postcss-import": "^11.0.0",
- "postcss-js": "^1.0.0",
+ "postcss-js": "^2.0.0",
"standard": "^11.0.0",
"standard-version": "^4.0.0",
"sugarss": "^1.0.0",
From fbf05deac273224cff723d52038bb484c333f0f1 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 11:27:14 +0200
Subject: [PATCH 11/27] test: replace helpers with `@webpack-utilities/test`
(#386)
---
package.json | 15 +++--
{lib => src}/Error.js | 0
{lib => src}/index.js | 0
{lib => src}/options.js | 0
{lib => src}/options.json | 0
test/Errors.test.js | 54 +++++++++++++----
test/__snapshots__/Errors.test.js.snap | 6 +-
test/__snapshots__/loader.test.js.snap | 6 --
test/fixtures/watch/error.css | 1 -
test/fixtures/watch/index.css | 1 -
test/fixtures/watch/index.js | 3 -
test/fixtures/watch/style.css | 1 -
test/helpers/compilation.js | 66 --------------------
test/helpers/compiler.js | 63 -------------------
test/helpers/fs.js | 38 ------------
test/loader.test.js | 83 ++------------------------
test/options/config.test.js | 57 +++++++++++-------
test/options/exec.test.js | 18 +++---
test/options/parser.test.js | 19 +++---
test/options/plugins.test.js | 45 +++++++++-----
test/options/sourceMap.test.js | 34 +++++++----
test/options/stringifier.test.js | 19 +++---
test/options/syntax.test.js | 19 +++---
23 files changed, 180 insertions(+), 368 deletions(-)
rename {lib => src}/Error.js (100%)
rename {lib => src}/index.js (100%)
rename {lib => src}/options.js (100%)
rename {lib => src}/options.json (100%)
delete mode 100644 test/fixtures/watch/error.css
delete mode 100644 test/fixtures/watch/index.css
delete mode 100644 test/fixtures/watch/index.js
delete mode 100644 test/fixtures/watch/style.css
delete mode 100644 test/helpers/compilation.js
delete mode 100644 test/helpers/compiler.js
delete mode 100644 test/helpers/fs.js
diff --git a/package.json b/package.json
index bbeaf8da..4388e118 100644
--- a/package.json
+++ b/package.json
@@ -2,9 +2,9 @@
"name": "postcss-loader",
"version": "2.1.6",
"description": "PostCSS loader for webpack",
- "main": "lib/index.js",
+ "main": "src/index.js",
"files": [
- "lib"
+ "src"
],
"engines": {
"node": ">= 6"
@@ -16,21 +16,20 @@
"schema-utils": "^0.4.0"
},
"devDependencies": {
- "jest": "^22.0.0",
+ "@webpack-utilities/test": "^1.0.0-alpha.0",
+ "jest": "^23.0.0",
"jsdoc-to-markdown": "^4.0.0",
- "memory-fs": "^0.4.0",
"postcss-import": "^11.0.0",
"postcss-js": "^2.0.0",
"standard": "^11.0.0",
"standard-version": "^4.0.0",
"sugarss": "^1.0.0",
- "util.promisify": "^1.0.0",
- "webpack": "^3.0.0"
+ "webpack": "^4.0.0"
},
"scripts": {
"lint": "standard --env jest",
- "test": "jest --env=node --verbose --coverage",
- "docs": "jsdoc2md lib/index.js > LOADER.md",
+ "test": "jest --env node --verbose --coverage",
+ "docs": "jsdoc2md src/*.js > LOADER.md",
"clean": "rm -rf coverage test/outputs",
"release": "standard-version"
},
diff --git a/lib/Error.js b/src/Error.js
similarity index 100%
rename from lib/Error.js
rename to src/Error.js
diff --git a/lib/index.js b/src/index.js
similarity index 100%
rename from lib/index.js
rename to src/index.js
diff --git a/lib/options.js b/src/options.js
similarity index 100%
rename from lib/options.js
rename to src/options.js
diff --git a/lib/options.json b/src/options.json
similarity index 100%
rename from lib/options.json
rename to src/options.json
diff --git a/test/Errors.test.js b/test/Errors.test.js
index da8b4cb9..718f8c9a 100644
--- a/test/Errors.test.js
+++ b/test/Errors.test.js
@@ -1,21 +1,41 @@
-'use strict'
-
-const webpack = require('./helpers/compiler')
-const { loader } = require('./helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Errors', () => {
test('Validation Error', () => {
- const loader = require('../lib')
+ const config = {
+ loader: {
+ test: /\.css$/,
+ options: {
+ sourceMap: 1
+ }
+ }
+ }
+
+ return webpack('css/index.js', config).then((stats) => {
+ const { source } = stats.toJson().modules[1]
- const error = () => loader.call({ query: { sourceMap: 1 } })
+ // eslint-disable-next-line
+ const error = () => eval(source)
- expect(error).toThrow()
- expect(error).toThrowErrorMatchingSnapshot()
+ expect(error).toThrow()
+
+ try {
+ error()
+ } catch (err) {
+ const message = err.message
+ .split('\n')
+ .slice(1)
+ .join('\n')
+
+ expect(message).toMatchSnapshot()
+ }
+ })
})
test('Syntax Error', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
parser: 'sugarss'
}
@@ -23,9 +43,23 @@ describe('Errors', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const error = loader(stats).err
+ const { source } = stats.toJson().modules[1]
- expect(error[0]).toMatchSnapshot()
+ // eslint-disable-next-line
+ const error = () => eval(source)
+
+ expect(error).toThrow()
+
+ try {
+ error()
+ } catch (err) {
+ const message = err.message
+ .split('\n')
+ .slice(1)
+ .join('\n')
+
+ expect(message).toMatchSnapshot()
+ }
})
})
})
diff --git a/test/__snapshots__/Errors.test.js.snap b/test/__snapshots__/Errors.test.js.snap
index cba7269b..6db3e25c 100644
--- a/test/__snapshots__/Errors.test.js.snap
+++ b/test/__snapshots__/Errors.test.js.snap
@@ -1,18 +1,18 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Errors Syntax Error 1`] = `
-[ModuleBuildError: Module build failed: Syntax Error
+"Syntax Error
(1:3) Unexpected separator in property
[31m[1m>[22m[39m[90m 1 | [39ma [33m{[39m color[33m:[39m black [33m}[39m
[90m | [39m [31m[1m^[22m[39m
[90m 2 | [39m
-]
+"
`;
exports[`Errors Validation Error 1`] = `
-"PostCSS Loader Invalid Options
+"ValidationError: PostCSS Loader Invalid Options
options.sourceMap should be string,boolean
"
diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap
index b88ef9ef..97a69ae8 100644
--- a/test/__snapshots__/loader.test.js.snap
+++ b/test/__snapshots__/loader.test.js.snap
@@ -1,9 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Loader Default 1`] = `"module.exports = \\"a { color: black }\\\\n\\""`;
-
-exports[`Loader Watching Dependencies Error 1`] = `"module.exports = \\"a { color: black }\\\\n\\""`;
-
-exports[`Loader Watching Dependencies Error 2`] = `"throw new Error(\\"Module build failed: Syntax Error \\\\n\\\\n(1:5) Unknown word\\\\n\\\\n\\\\u001b[31m\\\\u001b[1m>\\\\u001b[22m\\\\u001b[39m\\\\u001b[90m 1 | \\\\u001b[39ma \\\\u001b[33m{\\\\u001b[39m color black \\\\u001b[33m}\\\\u001b[39m\\\\n \\\\u001b[90m | \\\\u001b[39m \\\\u001b[31m\\\\u001b[1m^\\\\u001b[22m\\\\u001b[39m\\\\n \\\\u001b[90m 2 | \\\\u001b[39m\\\\n\\");"`;
-
-exports[`Loader Watching Dependencies Error 3`] = `"module.exports = \\"a { color: black }\\\\n\\""`;
diff --git a/test/fixtures/watch/error.css b/test/fixtures/watch/error.css
deleted file mode 100644
index 4943cb88..00000000
--- a/test/fixtures/watch/error.css
+++ /dev/null
@@ -1 +0,0 @@
-a { color black }
diff --git a/test/fixtures/watch/index.css b/test/fixtures/watch/index.css
deleted file mode 100644
index fa33ad5f..00000000
--- a/test/fixtures/watch/index.css
+++ /dev/null
@@ -1 +0,0 @@
-a { color: black }
diff --git a/test/fixtures/watch/index.js b/test/fixtures/watch/index.js
deleted file mode 100644
index 61e122b2..00000000
--- a/test/fixtures/watch/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import style from './style.css'
-
-export default style
diff --git a/test/fixtures/watch/style.css b/test/fixtures/watch/style.css
deleted file mode 100644
index 40d6c214..00000000
--- a/test/fixtures/watch/style.css
+++ /dev/null
@@ -1 +0,0 @@
-@import "./import";
diff --git a/test/helpers/compilation.js b/test/helpers/compilation.js
deleted file mode 100644
index 2f61ffbf..00000000
--- a/test/helpers/compilation.js
+++ /dev/null
@@ -1,66 +0,0 @@
-'use strict'
-
-const loader = (stats) => {
- const modules = stats.compilation.modules
-
- return {
- err: modules.map((module) => module.errors)[1],
- src: modules.map((module) => module._source._value)[1],
- map: modules.map((module) => module._source._sourceMap)[1],
- meta: modules.map((module) => module.meta),
- warnings: modules.map((module) => module.warnings)[1]
- }
-}
-
-const loaders = (stats, i) => {
- const modules = stats.compilation.modules
-
- return i >= 0
- ? {
- err: modules.map((module) => module.errors)[i],
- src: modules.map((module) => module._source._value)[i],
- map: modules.map((module) => module._source._sourceMap)[i],
- meta: modules.map((module) => module.meta)[i],
- warning: modules.map((module) => module.warnings)[i]
- }
- : {
- err: modules.map((module) => module.errors),
- src: modules.map((module) => module._source._value),
- map: modules.map((module) => module._source._sourceMap),
- meta: modules.map((module) => module.meta),
- warning: modules.map((module) => module.warnings)
- }
-}
-
-const assets = (stats, i) => {
- const asset = (asset) => {
- if (/map/.test(asset)) return false
- return stats.compilation.assets[asset].sourceAndMap()
- }
-
- const assets = Object.keys(stats.compilation.assets)
- .map(asset)
- .filter(Boolean)
-
- return i >= 0 ? assets[i] : assets
-}
-
-const errors = (stats, i) => {
- const errors = stats.compilation.errors
-
- return i >= 0 ? errors[i] : errors
-}
-
-const warnings = (stats, i) => {
- const warnings = stats.compilation.warnings
-
- return i >= 0 ? warnings[i] : warnings
-}
-
-module.exports = {
- loader,
- loaders,
- assets,
- errors,
- warnings
-}
diff --git a/test/helpers/compiler.js b/test/helpers/compiler.js
deleted file mode 100644
index bef499a2..00000000
--- a/test/helpers/compiler.js
+++ /dev/null
@@ -1,63 +0,0 @@
-'use strict'
-
-const path = require('path')
-const webpack = require('webpack')
-const MemoryFS = require('memory-fs')
-
-module.exports = function compiler (fixture, config, options) {
- config = {
- devtool: config.devtool || 'sourcemap',
- context: path.resolve(__dirname, '..', 'fixtures'),
- entry: `./${fixture}`,
- output: {
- path: path.resolve(
- __dirname,
- `../outputs/${config.path ? config.path : ''}`
- ),
- filename: '[name].bundle.js'
- },
- module: {
- rules: config.rules || config.loader
- ? [
- {
- test: config.loader.test || /\.(css|sss)$/,
- use: {
- loader: path.resolve(__dirname, '../../lib'),
- options: config.loader.options || {}
- }
- }
- ]
- : []
- },
- plugins: [
- new webpack.optimize.CommonsChunkPlugin({
- name: [ 'runtime' ],
- minChunks: Infinity
- })
- ].concat(config.plugins || [])
- }
-
- options = Object.assign({ emit: false }, options)
-
- const compiler = webpack(config)
-
- if (!options.emit) compiler.outputFileSystem = new MemoryFS()
-
- if (options.watch) {
- return new Promise((resolve, reject) => {
- const watcher = compiler.watch({}, (err, stats) => {
- options.watch(err, stats, () => {
- watcher.close(resolve)
- })
- })
- })
- } else {
- return new Promise((resolve, reject) => {
- return compiler.run((err, stats) => {
- if (err) reject(err)
-
- resolve(stats)
- })
- })
- }
-}
diff --git a/test/helpers/fs.js b/test/helpers/fs.js
deleted file mode 100644
index 9c806461..00000000
--- a/test/helpers/fs.js
+++ /dev/null
@@ -1,38 +0,0 @@
-const path = require('path')
-const promisify = require('util.promisify')
-
-const {
- unlink: _unlink,
- readFile: _readFile,
- writeFile: _writeFile
-} = require('fs')
-
-const fs = {
- readFile: promisify(_readFile),
- writeFile: promisify(_writeFile),
- unlink: promisify(_unlink)
-}
-
-function readFile (name) {
- const file = path.join(__dirname, '../fixtures', name)
-
- return fs.readFile(file)
- .then((data) => data.toString())
-}
-
-function writeFile (name, data) {
- const file = path.join(__dirname, '../fixtures', name)
-
- return fs.writeFile(file, data)
-}
-
-module.exports.copyFile = function copyFile (src, dest) {
- return readFile(src)
- .then((data) => writeFile(dest, data))
-}
-
-module.exports.deleteFile = function deleteFile (name) {
- const file = path.join(__dirname, '../fixtures', name)
-
- return fs.unlink(file)
-}
diff --git a/test/loader.test.js b/test/loader.test.js
index d3296840..8c8ae36d 100644
--- a/test/loader.test.js
+++ b/test/loader.test.js
@@ -1,13 +1,10 @@
-'use strict'
-
-const webpack = require('./helpers/compiler')
-const { loader } = require('./helpers/compilation')
-const { copyFile, deleteFile } = require('./helpers/fs')
+const { webpack } = require('@webpack-utilities/test')
describe('Loader', () => {
test('Default', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
plugins: []
}
@@ -15,80 +12,10 @@ describe('Loader', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
-
- expect(src).toEqual('module.exports = "a { color: black }\\n"')
- expect(src).toMatchSnapshot()
- })
- })
-
- describe('Watching', () => {
- describe('Dependencies', () => {
- const files = {
- css: 'watch/index.css',
- error: 'watch/error.css',
- changed: 'watch/import.css'
- }
-
- beforeEach(() => copyFile(files.css, files.changed))
-
- afterEach(() => deleteFile(files.changed))
-
- test('Error', () => {
- const config = {
- loader: {
- options: {
- plugins: [
- require('postcss-import')
- ]
- }
- }
- }
-
- const steps = [
- (stats) => {
- const { err, src } = loader(stats)
-
- expect(src).toMatchSnapshot()
- expect(err.length).toEqual(0)
-
- return copyFile(files.error, files.changed)
- },
- (stats) => {
- const { err, src } = loader(stats)
-
- expect(src).toMatchSnapshot()
- expect(err.length).toEqual(1)
-
- return copyFile(files.css, files.changed)
- },
- (stats, close) => {
- const { err, src } = loader(stats)
-
- expect(src).toMatchSnapshot()
- expect(src).toEqual('module.exports = "a { color: black }\\n"')
- expect(err.length).toEqual(0)
-
- return close()
- }
- ]
-
- let step = 0
-
- const options = {
- watch (err, stats, close) {
- if (err) {
- throw err
- }
-
- steps[step](stats, close)
-
- step++
- }
- }
+ const { source } = stats.toJson().modules[1]
- return webpack('watch/index.js', config, options)
- })
+ expect(source).toEqual('module.exports = "a { color: black }\\n"')
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/config.test.js b/test/options/config.test.js
index 9bb52a31..d9025a99 100644
--- a/test/options/config.test.js
+++ b/test/options/config.test.js
@@ -1,25 +1,28 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Config - {Object}', () => {
const config = {
- loader: {}
+ loader: {
+ test: /\.css$/
+ }
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
test('Config - Path - {String}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
config: { path: 'test/fixtures/config/postcss.config.js' }
}
@@ -27,16 +30,17 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a { color: black }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a { color: black }\\n"')
+ expect(source).toMatchSnapshot()
})
})
test('Config - Context - {Object}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
config: {
path: 'test/fixtures/config/postcss.config.js',
@@ -47,16 +51,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
+
+ expect(source).toMatchSnapshot()
})
})
test('Config - Context - {Object} - with ident', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
config: {
@@ -68,16 +76,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
- test('Pass loader object to config context', () => {
+ test('Config – Context – Loader {Object}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
config: {
path: 'test/fixtures/config/context/postcss.config.js'
@@ -87,11 +99,12 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const assets = stats.compilation.assets
- const expectedAssetName = 'asset.txt'
+ const { assets } = stats.compilation
+
+ const asset = 'asset.txt'
- expect(expectedAssetName in assets).toBeTruthy()
- expect(assets[expectedAssetName].source()).toBe('123')
+ expect(asset in assets).toBeTruthy()
+ expect(assets[asset].source()).toBe('123')
})
})
})
diff --git a/test/options/exec.test.js b/test/options/exec.test.js
index ac61490e..45716078 100644
--- a/test/options/exec.test.js
+++ b/test/options/exec.test.js
@@ -1,7 +1,4 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Exec - {Boolean}', () => {
@@ -15,10 +12,13 @@ describe('Options', () => {
}
return webpack('jss/exec/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a {\\n color: green\\n}"'
+ )
- expect(src).toEqual('module.exports = "a {\\n color: green\\n}"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
@@ -32,9 +32,9 @@ describe('Options', () => {
}
return webpack('jss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/parser.test.js b/test/options/parser.test.js
index 58e3ecf4..2480744a 100644
--- a/test/options/parser.test.js
+++ b/test/options/parser.test.js
@@ -1,12 +1,10 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Parser - {String}', () => {
const config = {
loader: {
+ test: /\.sss$/,
options: {
parser: 'sugarss'
}
@@ -14,16 +12,17 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
+ expect(source).toMatchSnapshot()
})
})
test('Parser - {Object}', () => {
const config = {
loader: {
+ test: /\.sss$/,
options: {
ident: 'postcss',
parser: require('sugarss')
@@ -32,10 +31,10 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a {\\n color: black\\n}\\n"')
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/plugins.test.js b/test/options/plugins.test.js
index bc98ad3c..0f700b68 100644
--- a/test/options/plugins.test.js
+++ b/test/options/plugins.test.js
@@ -1,12 +1,10 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Plugins - {Array}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
plugins: [ require('../fixtures/config/plugin')() ]
@@ -15,16 +13,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
test('Plugins - {Object}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
plugins: require('../fixtures/config/plugin')
@@ -33,16 +35,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
test('Plugins - {Function} - {Array}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
plugins: () => [ require('../fixtures/config/plugin')() ]
@@ -51,16 +57,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
+
+ expect(source).toMatchSnapshot()
})
})
test('Plugins - {Function} - {Object}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
plugins: () => require('../fixtures/config/plugin')()
@@ -69,10 +79,13 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/sourceMap.test.js b/test/options/sourceMap.test.js
index 3669127a..b321c77f 100644
--- a/test/options/sourceMap.test.js
+++ b/test/options/sourceMap.test.js
@@ -1,13 +1,12 @@
-'use strict'
-
const path = require('path')
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Sourcemap - {Boolean}', () => {
const config = {
+ devtool: 'sourcemap',
loader: {
+ test: /\.css$/,
options: {
sourceMap: true
}
@@ -15,15 +14,20 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
- const map = loader(stats).map
+ const map = stats.compilation.modules[1]._source._sourceMap
- map.file = path.relative(__dirname, map.file)
- map.sources = map.sources.map((src) => path.relative(__dirname, src))
+ map.file = path.posix.relative(__dirname, map.file)
+ map.sources = map.sources.map(
+ (src) => path.posix.relative(__dirname, src)
+ )
expect(map).toMatchSnapshot()
})
@@ -32,6 +36,7 @@ describe('Options', () => {
test('Sourcemap - {String}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
sourceMap: 'inline'
}
@@ -39,10 +44,13 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
+
+ expect(source).toEqual(
+ 'module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n\\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QvZml4dHVyZXMvY3NzL3N0eWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxJQUFJLDJCQUFZLEVBQUUiLCJmaWxlIjoidGVzdC9maXh0dXJlcy9jc3Mvc3R5bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYSB7IGNvbG9yOiBibGFjayB9XG4iXX0= */"'
+ )
- expect(src).toEqual('module.exports = "a { color: rgba(255, 0, 0, 1.0) }\\n\\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlc3QvZml4dHVyZXMvY3NzL3N0eWxlLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxJQUFJLDJCQUFZLEVBQUUiLCJmaWxlIjoidGVzdC9maXh0dXJlcy9jc3Mvc3R5bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiYSB7IGNvbG9yOiBibGFjayB9XG4iXX0= */"')
- expect(src).toMatchSnapshot()
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/stringifier.test.js b/test/options/stringifier.test.js
index bf94b46a..e8c37288 100644
--- a/test/options/stringifier.test.js
+++ b/test/options/stringifier.test.js
@@ -1,12 +1,10 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Stringifier - {String}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
stringifier: 'sugarss'
}
@@ -14,16 +12,17 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a color: black\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a color: black\\n"')
+ expect(source).toMatchSnapshot()
})
})
test('Stringifier - {Object}', () => {
const config = {
loader: {
+ test: /\.css$/,
options: {
ident: 'postcss',
stringifier: require('sugarss')
@@ -32,10 +31,10 @@ describe('Options', () => {
}
return webpack('css/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a color: black\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a color: black\\n"')
+ expect(source).toMatchSnapshot()
})
})
})
diff --git a/test/options/syntax.test.js b/test/options/syntax.test.js
index 27d152cc..45617909 100644
--- a/test/options/syntax.test.js
+++ b/test/options/syntax.test.js
@@ -1,12 +1,10 @@
-'use strict'
-
-const webpack = require('../helpers/compiler')
-const { loader } = require('../helpers/compilation')
+const { webpack } = require('@webpack-utilities/test')
describe('Options', () => {
test('Syntax - {String}', () => {
const config = {
loader: {
+ test: /\.sss$/,
options: {
syntax: 'sugarss'
}
@@ -14,16 +12,17 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a\\n color: black\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a\\n color: black\\n"')
+ expect(source).toMatchSnapshot()
})
})
test('Syntax - {Object}', () => {
const config = {
loader: {
+ test: /\.sss$/,
options: {
ident: 'postcss',
syntax: require('sugarss')
@@ -32,10 +31,10 @@ describe('Options', () => {
}
return webpack('sss/index.js', config).then((stats) => {
- const src = loader(stats).src
+ const { source } = stats.toJson().modules[1]
- expect(src).toEqual('module.exports = "a\\n color: black\\n"')
- expect(src).toMatchSnapshot()
+ expect(source).toEqual('module.exports = "a\\n color: black\\n"')
+ expect(source).toMatchSnapshot()
})
})
})
From 549ea0882ceab46f316c304ca8efd635bf903a10 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 12:35:45 +0200
Subject: [PATCH 12/27] fix(options): improved `ValidationError` messages
---
src/options.json | 18 ++++++++++++++++++
test/__snapshots__/Errors.test.js.snap | 8 +++++---
2 files changed, 23 insertions(+), 3 deletions(-)
diff --git a/src/options.json b/src/options.json
index e4546157..956cd39c 100644
--- a/src/options.json
+++ b/src/options.json
@@ -11,6 +11,12 @@
"type": "object"
}
},
+ "errorMessage": {
+ "properties": {
+ "ctx": "should be {Object} (https://github.com/postcss/postcss-loader#context-ctx)",
+ "path": "should be {String} (https://github.com/postcss/postcss-loader#path)"
+ }
+ },
"additionalProperties": false
},
"exec": {
@@ -39,5 +45,17 @@
"type": [ "string", "boolean" ]
}
},
+ "errorMessage": {
+ "properties": {
+ "exec": "should be {Boolean} (https://github.com/postcss/postcss-loader#exec)",
+ "ident": "should be {String} (https://github.com/postcss/postcss-loader#plugins)",
+ "config": "should be {Object} (https://github.com/postcss/postcss-loader#config)",
+ "parser": "should be {String|Object} (https://github.com/postcss/postcss-loader#parser)",
+ "syntax": "should be {String|Object} (https://github.com/postcss/postcss-loader#syntax)",
+ "stringifier": "should be {String|Object} (https://github.com/postcss/postcss-loader#stringifier)",
+ "plugins": "should be {Array|Object|Function} (https://github.com/postcss/postcss-loader#plugins)",
+ "sourceMap": "should be {String|Boolean} (https://github.com/postcss/postcss-loader#sourcemap)"
+ }
+ },
"additionalProperties": true
}
diff --git a/test/__snapshots__/Errors.test.js.snap b/test/__snapshots__/Errors.test.js.snap
index 6db3e25c..dedd2684 100644
--- a/test/__snapshots__/Errors.test.js.snap
+++ b/test/__snapshots__/Errors.test.js.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Errors Syntax Error 1`] = `
-"Syntax Error
+"Syntax Error
(1:3) Unexpected separator in property
@@ -14,6 +14,8 @@ exports[`Errors Syntax Error 1`] = `
exports[`Errors Validation Error 1`] = `
"ValidationError: PostCSS Loader Invalid Options
-options.sourceMap should be string,boolean
-"
+options.sourceMap should be {String|Boolean} (https://github.com/postcss/postcss-loader#sourcemap)
+
+ at validateOptions (/Users/Cini/Github/webpack/loaders/postcss/node_modules/@webpack-utilities/schema/src/validateOptions.js:25:11)
+ at Object.loader (/Users/Cini/Github/webpack/loaders/postcss/src/index.js:44:3)"
`;
From 2c6033b50f2ac6c3dd15c49e91b30642bd65dc85 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 14:19:11 +0200
Subject: [PATCH 13/27] test(Errors): remove stacktrace from snapshot
---
test/Errors.test.js | 6 +++---
test/__snapshots__/Errors.test.js.snap | 9 +--------
2 files changed, 4 insertions(+), 11 deletions(-)
diff --git a/test/Errors.test.js b/test/Errors.test.js
index 718f8c9a..5379df1d 100644
--- a/test/Errors.test.js
+++ b/test/Errors.test.js
@@ -23,9 +23,9 @@ describe('Errors', () => {
error()
} catch (err) {
const message = err.message
- .split('\n')
- .slice(1)
- .join('\n')
+ .split('\n\n')
+ .slice(1, -1)
+ .join('\n\n')
expect(message).toMatchSnapshot()
}
diff --git a/test/__snapshots__/Errors.test.js.snap b/test/__snapshots__/Errors.test.js.snap
index dedd2684..126692fa 100644
--- a/test/__snapshots__/Errors.test.js.snap
+++ b/test/__snapshots__/Errors.test.js.snap
@@ -11,11 +11,4 @@ exports[`Errors Syntax Error 1`] = `
"
`;
-exports[`Errors Validation Error 1`] = `
-"ValidationError: PostCSS Loader Invalid Options
-
-options.sourceMap should be {String|Boolean} (https://github.com/postcss/postcss-loader#sourcemap)
-
- at validateOptions (/Users/Cini/Github/webpack/loaders/postcss/node_modules/@webpack-utilities/schema/src/validateOptions.js:25:11)
- at Object.loader (/Users/Cini/Github/webpack/loaders/postcss/src/index.js:44:3)"
-`;
+exports[`Errors Validation Error 1`] = `"options.sourceMap should be {String|Boolean} (https://github.com/postcss/postcss-loader#sourcemap)"`;
From 8ac6fb57a2e80803c75b6aa30336126c45a5693c Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 14:20:43 +0200
Subject: [PATCH 14/27] fix(index): emit `warnings` as an instance of `{Error}`
---
src/Warning.js | 14 ++++++++++
src/index.js | 8 ++++--
test/Warnings.test.js | 33 ++++++++++++++++++++++++
test/__snapshots__/Warnings.test.js.snap | 7 +++++
4 files changed, 60 insertions(+), 2 deletions(-)
create mode 100644 src/Warning.js
create mode 100644 test/Warnings.test.js
create mode 100644 test/__snapshots__/Warnings.test.js.snap
diff --git a/src/Warning.js b/src/Warning.js
new file mode 100644
index 00000000..97273e63
--- /dev/null
+++ b/src/Warning.js
@@ -0,0 +1,14 @@
+class Warning extends Error {
+ constructor (warning) {
+ super()
+
+ const { line, column, text } = warning
+
+ this.name = 'LoaderWarning'
+ this.message = `\n(${line}:${column}) ${text}\n`
+
+ this.stack = false
+ }
+}
+
+module.exports = Warning
diff --git a/src/index.js b/src/index.js
index 5dc545e2..caf2a17a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -10,7 +10,9 @@ const validateOptions = require('schema-utils')
const postcss = require('postcss')
const postcssrc = require('postcss-load-config')
-const SyntaxError = require('./Error')
+const Warning = require('./Warning.js')
+const SyntaxError = require('./Error.js')
+const parseOptions = require('./options.js')
/**
* PostCSS Loader
@@ -143,7 +145,9 @@ module.exports = function loader (css, map, meta) {
return postcss(plugins)
.process(css, options)
.then((result) => {
- result.warnings().forEach((msg) => this.emitWarning(msg.toString()))
+ result.warnings().forEach((warning) => {
+ this.emitWarning(new Warning(warning))
+ })
result.messages.forEach((msg) => {
if (msg.type === 'dependency') this.addDependency(msg.file)
diff --git a/test/Warnings.test.js b/test/Warnings.test.js
new file mode 100644
index 00000000..7c5875b7
--- /dev/null
+++ b/test/Warnings.test.js
@@ -0,0 +1,33 @@
+const { webpack } = require('@webpack-utilities/test')
+
+const plugin = (options = {}) => (css, result) => {
+ css.walkDecls((node) => {
+ node.warn(result, '')
+ })
+}
+
+describe('Warnings', () => {
+ test('Plugins', () => {
+ const config = {
+ loader: {
+ test: /\.css$/,
+ options: {
+ plugins: [
+ plugin()
+ ]
+ }
+ }
+ }
+
+ return webpack('css/index.js', config).then((stats) => {
+ const warning = stats.compilation.warnings[0]
+
+ const message = warning.message
+ .split('\n')
+ .slice(1)
+ .join('\n')
+
+ expect(message).toMatchSnapshot()
+ })
+ })
+})
diff --git a/test/__snapshots__/Warnings.test.js.snap b/test/__snapshots__/Warnings.test.js.snap
new file mode 100644
index 00000000..d1d876e1
--- /dev/null
+++ b/test/__snapshots__/Warnings.test.js.snap
@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Warnings Plugins 1`] = `
+"
+(1:5)
+"
+`;
From f34954f7342159051f21a16acebd9e814dc51212 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 14:56:08 +0200
Subject: [PATCH 15/27] fix(index): add ast version (`meta.ast`)
---
src/index.js | 8 +++++++-
1 file changed, 7 insertions(+), 1 deletion(-)
diff --git a/src/index.js b/src/index.js
index caf2a17a..dce3db7e 100644
--- a/src/index.js
+++ b/src/index.js
@@ -163,7 +163,13 @@ module.exports = function loader (css, map, meta) {
if (!meta) meta = {}
- meta.ast = { 'type': 'postcss', root: result.root }
+ const ast = {
+ type: 'postcss',
+ version: processor.version,
+ root
+ }
+
+ meta.ast = ast
meta.messages = result.messages
if (this.loaderIndex === 0) {
From bdcbef03968363df7b85601713fa2a6dbce1c3a3 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sat, 4 Aug 2018 17:40:48 +0200
Subject: [PATCH 16/27] refactor(src): update code base with latest ES2015+
features
---
src/Error.js | 8 ++--
src/Warning.js | 2 +-
src/index.js | 59 +++++++++++++++++---------
src/options.js | 32 ++++++--------
test/__snapshots__/Errors.test.js.snap | 2 +-
5 files changed, 59 insertions(+), 44 deletions(-)
diff --git a/src/Error.js b/src/Error.js
index 05ea46ea..1ecf9fac 100644
--- a/src/Error.js
+++ b/src/Error.js
@@ -1,13 +1,13 @@
-'use strict'
-
class SyntaxError extends Error {
constructor (err) {
super(err)
- this.name = 'Syntax Error'
+ const { line, column, reason } = err
+
+ this.name = 'SyntaxError'
this.message = ''
- this.message += `${this.name} \n\n(${err.line}:${err.column}) ${err.reason}`
+ this.message += `${this.name} \n\n(${line}:${column}) ${reason}`
this.message += `\n\n${err.showSourceCode()}\n`
this.stack = false
diff --git a/src/Warning.js b/src/Warning.js
index 97273e63..31e97df8 100644
--- a/src/Warning.js
+++ b/src/Warning.js
@@ -2,7 +2,7 @@ class Warning extends Error {
constructor (warning) {
super()
- const { line, column, text } = warning
+ const { text, line, column } = warning
this.name = 'LoaderWarning'
this.message = `\n(${line}:${column}) ${text}\n`
diff --git a/src/index.js b/src/index.js
index dce3db7e..e100eb54 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,10 +1,6 @@
-'use strict'
-
const path = require('path')
-const loaderUtils = require('loader-utils')
-
-const parseOptions = require('./options')
+const { getOptions } = require('loader-utils')
const validateOptions = require('schema-utils')
const postcss = require('postcss')
@@ -42,7 +38,7 @@ const parseOptions = require('./options.js')
* @return {cb} cb Result
*/
module.exports = function loader (css, map, meta) {
- const options = Object.assign({}, loaderUtils.getOptions(this))
+ const options = Object.assign({}, getOptions(this))
validateOptions(require('./options.json'), options, 'PostCSS Loader')
@@ -96,16 +92,25 @@ module.exports = function loader (css, map, meta) {
return postcssrc(rc.ctx, rc.path)
}).then((config) => {
- if (!config) config = {}
+ if (!config) {
+ config = {}
+ }
- if (config.file) this.addDependency(config.file)
+ if (config.file) {
+ this.addDependency(config.file)
+ }
// Disable override `to` option from `postcss.config.js`
- if (config.options.to) delete config.options.to
+ if (config.options.to) {
+ delete config.options.to
+ }
// Disable override `from` option from `postcss.config.js`
- if (config.options.from) delete config.options.from
+ if (config.options.from) {
+ delete config.options.from
+ }
let plugins = config.plugins || []
+
let options = Object.assign({
from: file,
map: sourceMap
@@ -139,29 +144,39 @@ module.exports = function loader (css, map, meta) {
css = this.exec(css, this.resource)
}
- if (sourceMap && typeof map === 'string') map = JSON.parse(map)
- if (sourceMap && map) options.map.prev = map
+ if (sourceMap && typeof map === 'string') {
+ map = JSON.parse(map)
+ }
+
+ if (sourceMap && map) {
+ options.map.prev = map
+ }
return postcss(plugins)
.process(css, options)
.then((result) => {
+ let { css, map, root, processor, messages } = result
+
result.warnings().forEach((warning) => {
this.emitWarning(new Warning(warning))
})
- result.messages.forEach((msg) => {
- if (msg.type === 'dependency') this.addDependency(msg.file)
+ messages.forEach((msg) => {
+ if (msg.type === 'dependency') {
+ this.addDependency(msg.file)
+ }
})
- css = result.css
- map = result.map ? result.map.toJSON() : null
+ map = map ? map.toJSON() : null
if (map) {
map.file = path.resolve(map.file)
map.sources = map.sources.map((src) => path.resolve(src))
}
- if (!meta) meta = {}
+ if (!meta) {
+ meta = {}
+ }
const ast = {
type: 'postcss',
@@ -170,7 +185,7 @@ module.exports = function loader (css, map, meta) {
}
meta.ast = ast
- meta.messages = result.messages
+ meta.messages = messages
if (this.loaderIndex === 0) {
/**
@@ -199,8 +214,12 @@ module.exports = function loader (css, map, meta) {
return null
})
}).catch((err) => {
- if (err.file) this.addDependency(err.file)
+ if (err.file) {
+ this.addDependency(err.file)
+ }
- return err.name === 'CssSyntaxError' ? cb(new SyntaxError(err)) : cb(err)
+ return err.name === 'CssSyntaxError'
+ ? cb(new SyntaxError(err))
+ : cb(err)
})
}
diff --git a/src/options.js b/src/options.js
index 980e9366..dc0b21bf 100644
--- a/src/options.js
+++ b/src/options.js
@@ -1,25 +1,21 @@
-'use strict'
-
-module.exports = function parseOptions (params) {
- if (typeof params.plugins === 'function') {
- params.plugins = params.plugins.call(this, this)
+function parseOptions ({ exec, parser, syntax, stringifier, plugins }) {
+ if (typeof plugins === 'function') {
+ plugins = plugins.call(this, this)
}
- let plugins
-
- if (typeof params.plugins === 'undefined') plugins = []
- else if (Array.isArray(params.plugins)) plugins = params.plugins
- else plugins = [ params.plugins ]
+ if (typeof plugins === 'undefined') {
+ plugins = []
+ } else if (!Array.isArray(plugins)) {
+ plugins = [ plugins ]
+ }
const options = {}
- if (typeof params !== 'undefined') {
- options.parser = params.parser
- options.syntax = params.syntax
- options.stringifier = params.stringifier
- }
-
- const exec = params && params.exec
+ options.parser = parser
+ options.syntax = syntax
+ options.stringifier = stringifier
- return Promise.resolve({ options: options, plugins: plugins, exec: exec })
+ return Promise.resolve({ options, plugins, exec })
}
+
+module.exports = parseOptions
diff --git a/test/__snapshots__/Errors.test.js.snap b/test/__snapshots__/Errors.test.js.snap
index 126692fa..117cc8c7 100644
--- a/test/__snapshots__/Errors.test.js.snap
+++ b/test/__snapshots__/Errors.test.js.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Errors Syntax Error 1`] = `
-"Syntax Error
+"SyntaxError
(1:3) Unexpected separator in property
From 319d1f789ab41c4999f350adb3d1d0fd25765a19 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sun, 5 Aug 2018 04:25:20 +0200
Subject: [PATCH 17/27] chore(PULL_REQUEST_TEMPLATE): improve format and
content
---
.github/PULL_REQUEST_TEMPLATE.md | 59 +++++++++++++++++++-------------
1 file changed, 36 insertions(+), 23 deletions(-)
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index f8fd00e1..db913f82 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -1,50 +1,63 @@
-> ℹ️ Describe the big picture of your changes here to communicate to the maintainers
-why we should accept this pull request. If it fixes a bug or resolves a feature
-request, be sure to link to that issue.
+### Notable Changes
-### `Type`
----
+
-> ℹ️ What types of changes does your code introduce?
+#### `Commit Message Summary (CHANGELOG)`
-> _Put an `x` in the boxes that apply_
+
+
+
+```bash
+# Commit Message Body
+#
+# Example
+BREAKING CHANGE: requires `node >= v8.0.0`
+BREAKING CHANGE: `options.x` requires to be a `{Function}` now
+```
+
+### Type
+
+> ℹ️ What type of changes does your code introduce?
+
+
+
+- [ ] CI
- [ ] Fix
- [ ] Perf
- [ ] Docs
- [ ] Test
+- [ ] Style
+- [ ] Build
- [ ] Chore
- [ ] Feature
- [ ] Refactor
-### `SemVer`
----
+### Issues
-> ℹ️ What changes to the current `semver` range does your PR introduce?
+> ℹ️ What issue(s) (if any) are closed by your PR?
-> _Put an `x` in the boxes that apply_
+
-- [ ] Bug (:label: Patch)
-- [ ] Feature (:label: Minor)
-- [ ] Breaking Change (:label: Major)
+- Fixes `#1`
-### `Issues`
----
+### SemVer
-> ℹ️ What issue (if any) are closed by your PR?
+> ℹ️ What changes to the current `semver` range does your PR introduce?
-> _Replace `#1` with the error number that applies_
+
-- Fixes `#1`
+- [ ] Fix (:label: Patch)
+- [ ] Feature (:label: Minor)
+- [ ] Breaking Change (:label: Major)
-### `Checklist`
----
+### Checklist
> ℹ️ You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. This is a reminder of what we are going to look for before merging your code.
-> _Put an `x` in the boxes that apply._
+
- [ ] Lint and unit tests pass with my changes
-- [ ] I have added tests that prove my fix is effective/works
+- [ ] I have added tests that prove my fix is effective/works (if needed)
- [ ] I have added necessary documentation (if appropriate)
- [ ] Any dependent changes are merged and published in downstream modules
From 4a0328e81e834d44ff6139d4aef5d49ab64be04a Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sun, 5 Aug 2018 05:31:38 +0200
Subject: [PATCH 18/27] chore(ISSUE_TEMPLATE/BUG): move bug reports into their
own template
---
.github/ISSUE_TEMPLATE.md | 39 -----------------------------------
.github/ISSUE_TEMPLATE/BUG.md | 34 ++++++++++++++++++++++++++++++
2 files changed, 34 insertions(+), 39 deletions(-)
delete mode 100644 .github/ISSUE_TEMPLATE.md
create mode 100644 .github/ISSUE_TEMPLATE/BUG.md
diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md
deleted file mode 100644
index 8e3ceb2d..00000000
--- a/.github/ISSUE_TEMPLATE.md
+++ /dev/null
@@ -1,39 +0,0 @@
-Briefly describe the issue you are experiencing (or the feature you want to see
-added to the plugin). Tell us what you were trying to do and what happened
-instead. Remember, this is _not_ a place to ask questions. For that, go to
-http://gitter.im/postcss/postcss
-
-### `Details`
----
-
-Describe in more detail the problem you have been experiencing, if necessary.
-
-### `Error (Logs|Stacks)`
----
-
-Create a [gist](https://gist.github.com) which is a paste of your **full**
-logs, and link them here.
-
-Do **not** paste your full logs here (or at least hide them by using a ` ` block), as it will make this issue long and hard
-to read! If you are reporting a bug, **always** include logs!
-
-### `Reproduction [Code]`
----
-
-Please remember that, with sample code; it's easier to reproduce bug and much
-faster to fix it.
-
-Please refer to a simple code example.
-
-```bash
-$ git clone https://github.com//
-```
-
-### `Environment`
----
-
-Please provide information about your environment.
-
-|OS|node|npm|PostCSS|
-|:-:|:--:|:-:|:------:|
-|[name][version]|[version]|[version]|[version]|
diff --git a/.github/ISSUE_TEMPLATE/BUG.md b/.github/ISSUE_TEMPLATE/BUG.md
new file mode 100644
index 00000000..76e39d50
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/BUG.md
@@ -0,0 +1,34 @@
+---
+name: 🐛 Bug
+about: Report a Bug
+---
+
+
+
+### Details
+
+
+
+### Error (Logs|Stacks)
+
+
+
+
+
+### Reproduction (Code)
+
+
+
+
+
+```bash
+$ git clone https://github.com//
+```
+
+### Environment
+
+
+
+|OS|node|npm/yarn|package|
+|:-:|:--:|:-:|:------:|
+|[name][version]|[version]|[version]|[version]|
From 70f442631ad67f1cbcba4f461abc251da27b9b71 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sun, 5 Aug 2018 05:42:07 +0200
Subject: [PATCH 19/27] chore(ISSUE_TEMPLATE/FEATURE): add feature request
template
---
.github/ISSUE_TEMPLATE/FEATURE.md | 22 ++++++++++++++++++++++
1 file changed, 22 insertions(+)
create mode 100644 .github/ISSUE_TEMPLATE/FEATURE.md
diff --git a/.github/ISSUE_TEMPLATE/FEATURE.md b/.github/ISSUE_TEMPLATE/FEATURE.md
new file mode 100644
index 00000000..a4e981ef
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/FEATURE.md
@@ -0,0 +1,22 @@
+---
+name: 🌟 Feature
+about: Request a feature
+---
+
+### Proposal
+
+
+
+### Use Case
+
+
+
+### Implementation
+
+
+
+- [ ] I'm open to work on this
+ - [ ] I need help/mentorship
+- [ ] I'm unable to work on this
+
+
From 73a8c663e84fc890771bdd110378e61eeb4c855e Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Sun, 5 Aug 2018 05:45:48 +0200
Subject: [PATCH 20/27] chore(ISSUE_TEMPLATE/DOCS): add template for
documentation issues
---
.github/ISSUE_TEMPLATE/DOCS.md | 30 ++++++++++++++++++++++++++++++
1 file changed, 30 insertions(+)
create mode 100644 .github/ISSUE_TEMPLATE/DOCS.md
diff --git a/.github/ISSUE_TEMPLATE/DOCS.md b/.github/ISSUE_TEMPLATE/DOCS.md
new file mode 100644
index 00000000..079242ff
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/DOCS.md
@@ -0,0 +1,30 @@
+---
+name: 📖 Docs
+about: Report documentation related issues
+---
+
+### Type
+
+
+
+- [ ] Other
+- [ ] Wrong
+- [ ] Unclear
+- [ ] Missing
+
+### Details
+
+
+
+### Location
+
+
+
+- [ ] README
+- [ ] LICENSE
+- [ ] CHANGELOG
+- [ ] ISSUE_TEMPLATE
+ - [ ] BUG
+ - [ ] DOCS
+ - [ ] FEATURE
+- [ ] PULL_REQUEST_TEMPLATE
From ea68a42f546db1870411779ea29aadea3890abb8 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 16:38:39 +0200
Subject: [PATCH 21/27] chore(package): update `schema-utils` v0.4.5...1.0.0
(`dependencies`)
---
package.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/package.json b/package.json
index 4388e118..104dc793 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
"loader-utils": "^1.1.0",
"postcss": "^7.0.0",
"postcss-load-config": "^2.0.0",
- "schema-utils": "^0.4.0"
+ "schema-utils": "^1.0.0"
},
"devDependencies": {
"@webpack-utilities/test": "^1.0.0-alpha.0",
From 95de4c1e5466156668f89ff1687e3435c986f687 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 17:15:32 +0200
Subject: [PATCH 22/27] docs(LOADER): update JSDoc
---
LOADER.md | 46 -----------------
docs/LOADER.md | 130 +++++++++++++++++++++++++++++++++++++++++++++++++
package.json | 2 +-
src/Error.js | 10 ++++
src/Warning.js | 10 ++++
src/index.js | 55 ++++++++++++---------
src/options.js | 15 ++++++
7 files changed, 197 insertions(+), 71 deletions(-)
delete mode 100644 LOADER.md
create mode 100644 docs/LOADER.md
diff --git a/LOADER.md b/LOADER.md
deleted file mode 100644
index 8f64d78f..00000000
--- a/LOADER.md
+++ /dev/null
@@ -1,46 +0,0 @@
-
-
-## loader(css, map) ⇒ cb
-PostCSS Loader
-
-> Loads && processes CSS with [PostCSS](https://github.com/postcss/postcss)
-
-**Kind**: global function
-**Returns**: cb
- cb Result
-**Requires**: module:path
, module:loader-utils
, module:schema-utils
, module:postcss
, module:postcss-load-config
, module:Error
-**Version**: 2.0.0
-**Author**: Andrey Sitnik (@ai)
-**License**: MIT
-
-| Param | Type | Description |
-| --- | --- | --- |
-| css | String
| Source |
-| map | Object
| Source Map |
-
-
-* [loader(css, map)](#loader) ⇒ cb
- * [.cb](#loader.cb) : function
- * [.cb](#loader.cb) : function
-
-
-
-### loader.cb : function
-**Kind**: static typedef of [loader
](#loader)
-
-| Param | Type | Description |
-| --- | --- | --- |
-| null | Object
| Error |
-| result | String
| Result (JS Module) |
-| map | Object
| Source Map |
-
-
-
-### loader.cb : function
-**Kind**: static typedef of [loader
](#loader)
-
-| Param | Type | Description |
-| --- | --- | --- |
-| null | Object
| Error |
-| css | String
| Result (Raw Module) |
-| map | Object
| Source Map |
-
diff --git a/docs/LOADER.md b/docs/LOADER.md
new file mode 100644
index 00000000..deb2d04d
--- /dev/null
+++ b/docs/LOADER.md
@@ -0,0 +1,130 @@
+## Modules
+
+
+- postcss-loader
+
+
+
+## Classes
+
+
+- SyntaxError ⇐
Error
+
+- Warning ⇐
Error
+
+
+
+## Functions
+
+
+- loader(css, map) ⇒
cb
+PostCSS Loader
+Loads && processes CSS with PostCSS
+
+- parseOptions(exec, parser, syntax, stringifier, plugins) ⇒
Promise
+PostCSS Options Parser
+Transforms the loader options into a valid postcss config {Object}
+
+
+
+
+
+## postcss-loader
+**Requires**: module:path
, module:loader-utils
, module:schema-utils
, module:postcss
, module:postcss-load-config
, module:./options.js
, module:./Warning.js
, module:./SyntaxError.js
+**Version**: 3.0.0
+**Author**: Andrey Sitnik (@ai)
+**License**: MIT
+
+
+## SyntaxError ⇐ Error
+**Kind**: global class
+**Extends**: Error
+
+
+### new SyntaxError(err)
+**PostCSS Syntax Error**
+
+Loader wrapper for postcss syntax errors
+
+
+| Param | Type | Description |
+| --- | --- | --- |
+| err | Object
| CssSyntaxError |
+
+
+
+## Warning ⇐ Error
+**Kind**: global class
+**Extends**: Error
+
+
+### new Warning(warning)
+**PostCSS Plugin Warning**
+
+Loader wrapper for postcss plugin warnings (`root.messages`)
+
+
+| Param | Type | Description |
+| --- | --- | --- |
+| warning | Object
| PostCSS Warning |
+
+
+
+## loader(css, map) ⇒ cb
+**PostCSS Loader**
+
+Loads && processes CSS with [PostCSS](https://github.com/postcss/postcss)
+
+**Kind**: global function
+**Returns**: cb
- cb Result
+
+| Param | Type | Description |
+| --- | --- | --- |
+| css | String
| Source |
+| map | Object
| Source Map |
+
+
+* [loader(css, map)](#loader) ⇒ cb
+ * [.cb](#loader.cb) : function
+ * [.cb](#loader.cb) : function
+
+
+
+### loader.cb : function
+**Kind**: static typedef of [loader
](#loader)
+
+| Param | Type | Description |
+| --- | --- | --- |
+| null | Object
| Error |
+| css | String
| Result (JS Module) |
+| map | Object
| Source Map |
+
+
+
+### loader.cb : function
+**Kind**: static typedef of [loader
](#loader)
+
+| Param | Type | Description |
+| --- | --- | --- |
+| null | Object
| Error |
+| css | String
| Result (Raw Module) |
+| map | Object
| Source Map |
+
+
+
+## parseOptions(exec, parser, syntax, stringifier, plugins) ⇒ Promise
+**PostCSS Options Parser**
+
+Transforms the loader options into a valid postcss config `{Object}`
+
+**Kind**: global function
+**Returns**: Promise
- PostCSS Config
+
+| Param | Type | Description |
+| --- | --- | --- |
+| exec | Boolean
| Execute CSS-in-JS |
+| parser | String
\| Object
| PostCSS Parser |
+| syntax | String
\| Object
| PostCSS Syntax |
+| stringifier | String
\| Object
| PostCSS Stringifier |
+| plugins | Array
\| Object
\| function
| PostCSS Plugins |
+
diff --git a/package.json b/package.json
index 104dc793..0ebf1bbb 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,7 @@
"scripts": {
"lint": "standard --env jest",
"test": "jest --env node --verbose --coverage",
- "docs": "jsdoc2md src/*.js > LOADER.md",
+ "docs": "jsdoc2md src/*.js > docs/LOADER.md",
"clean": "rm -rf coverage test/outputs",
"release": "standard-version"
},
diff --git a/src/Error.js b/src/Error.js
index 1ecf9fac..8c6d6a2b 100644
--- a/src/Error.js
+++ b/src/Error.js
@@ -1,3 +1,13 @@
+/**
+ * **PostCSS Syntax Error**
+ *
+ * Loader wrapper for postcss syntax errors
+ *
+ * @class SyntaxError
+ * @extends Error
+ *
+ * @param {Object} err CssSyntaxError
+ */
class SyntaxError extends Error {
constructor (err) {
super(err)
diff --git a/src/Warning.js b/src/Warning.js
index 31e97df8..6d032720 100644
--- a/src/Warning.js
+++ b/src/Warning.js
@@ -1,3 +1,13 @@
+/**
+ * **PostCSS Plugin Warning**
+ *
+ * Loader wrapper for postcss plugin warnings (`root.messages`)
+ *
+ * @class Warning
+ * @extends Error
+ *
+ * @param {Object} warning PostCSS Warning
+ */
class Warning extends Error {
constructor (warning) {
super()
diff --git a/src/index.js b/src/index.js
index e100eb54..bb576c32 100644
--- a/src/index.js
+++ b/src/index.js
@@ -11,33 +11,18 @@ const SyntaxError = require('./Error.js')
const parseOptions = require('./options.js')
/**
- * PostCSS Loader
+ * **PostCSS Loader**
*
- * > Loads && processes CSS with [PostCSS](https://github.com/postcss/postcss)
- *
- * @author Andrey Sitnik (@ai)
- *
- * @license MIT
- * @version 2.0.0
- *
- * @requires path
- *
- * @requires loader-utils
- * @requires schema-utils
- *
- * @requires postcss
- * @requires postcss-load-config
- *
- * @requires Error
+ * Loads && processes CSS with [PostCSS](https://github.com/postcss/postcss)
*
* @method loader
*
- * @param {String} css Source
- * @param {Object} map Source Map
+ * @param {String} css Source
+ * @param {Object} map Source Map
*
- * @return {cb} cb Result
+ * @return {cb} cb Result
*/
-module.exports = function loader (css, map, meta) {
+function loader (css, map, meta) {
const options = Object.assign({}, getOptions(this))
validateOptions(require('./options.json'), options, 'PostCSS Loader')
@@ -192,9 +177,9 @@ module.exports = function loader (css, map, meta) {
* @memberof loader
* @callback cb
*
- * @param {Object} null Error
- * @param {String} result Result (JS Module)
- * @param {Object} map Source Map
+ * @param {Object} null Error
+ * @param {String} css Result (JS Module)
+ * @param {Object} map Source Map
*/
cb(null, `module.exports = ${JSON.stringify(css)}`, map)
@@ -223,3 +208,25 @@ module.exports = function loader (css, map, meta) {
: cb(err)
})
}
+
+/**
+ * @author Andrey Sitnik (@ai)
+ *
+ * @license MIT
+ * @version 3.0.0
+ *
+ * @module postcss-loader
+ *
+ * @requires path
+ *
+ * @requires loader-utils
+ * @requires schema-utils
+ *
+ * @requires postcss
+ * @requires postcss-load-config
+ *
+ * @requires ./options.js
+ * @requires ./Warning.js
+ * @requires ./SyntaxError.js
+ */
+module.exports = loader
diff --git a/src/options.js b/src/options.js
index dc0b21bf..fbe71369 100644
--- a/src/options.js
+++ b/src/options.js
@@ -1,3 +1,18 @@
+/**
+ * **PostCSS Options Parser**
+ *
+ * Transforms the loader options into a valid postcss config `{Object}`
+ *
+ * @method parseOptions
+ *
+ * @param {Boolean} exec Execute CSS-in-JS
+ * @param {String|Object} parser PostCSS Parser
+ * @param {String|Object} syntax PostCSS Syntax
+ * @param {String|Object} stringifier PostCSS Stringifier
+ * @param {Array|Object|Function} plugins PostCSS Plugins
+ *
+ * @return {Promise} PostCSS Config
+ */
function parseOptions ({ exec, parser, syntax, stringifier, plugins }) {
if (typeof plugins === 'function') {
plugins = plugins.call(this, this)
From 1f98aee4534f87eca93cfd374cc485e82899d716 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 17:18:25 +0200
Subject: [PATCH 23/27] refactor(Warning): add `warning` property checks
---
src/Warning.js | 13 ++++++++++---
test/__snapshots__/Warnings.test.js.snap | 6 +++---
2 files changed, 13 insertions(+), 6 deletions(-)
diff --git a/src/Warning.js b/src/Warning.js
index 6d032720..2355f4f5 100644
--- a/src/Warning.js
+++ b/src/Warning.js
@@ -10,12 +10,19 @@
*/
class Warning extends Error {
constructor (warning) {
- super()
+ super(warning)
const { text, line, column } = warning
- this.name = 'LoaderWarning'
- this.message = `\n(${line}:${column}) ${text}\n`
+ this.name = 'Warning'
+
+ this.message = `${this.name}\n\n`
+
+ if (typeof line !== 'undefined') {
+ this.message += `(${line}:${column}) `
+ }
+
+ this.message += `${text}`
this.stack = false
}
diff --git a/test/__snapshots__/Warnings.test.js.snap b/test/__snapshots__/Warnings.test.js.snap
index d1d876e1..9524418a 100644
--- a/test/__snapshots__/Warnings.test.js.snap
+++ b/test/__snapshots__/Warnings.test.js.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Warnings Plugins 1`] = `
-"
-(1:5)
-"
+"Warning
+
+(1:5) "
`;
From 962b1d60f41084630c33c5fdf1b886847178d214 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 17:19:50 +0200
Subject: [PATCH 24/27] refactor(options): remove `ident` from validation
schema
---
src/options.json | 4 ----
1 file changed, 4 deletions(-)
diff --git a/src/options.json b/src/options.json
index 956cd39c..1141d84a 100644
--- a/src/options.json
+++ b/src/options.json
@@ -22,9 +22,6 @@
"exec": {
"type": "boolean"
},
- "ident": {
- "type": "string"
- },
"parser": {
"type": [ "string", "object" ]
},
@@ -48,7 +45,6 @@
"errorMessage": {
"properties": {
"exec": "should be {Boolean} (https://github.com/postcss/postcss-loader#exec)",
- "ident": "should be {String} (https://github.com/postcss/postcss-loader#plugins)",
"config": "should be {Object} (https://github.com/postcss/postcss-loader#config)",
"parser": "should be {String|Object} (https://github.com/postcss/postcss-loader#parser)",
"syntax": "should be {String|Object} (https://github.com/postcss/postcss-loader#syntax)",
From d6931da177ac79707bd758436e476036a55e4f59 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 19:00:22 +0200
Subject: [PATCH 25/27] refactor(Error): add `error` property checks
---
src/Error.js | 22 ++++++++++++++++------
test/__snapshots__/Errors.test.js.snap | 2 +-
2 files changed, 17 insertions(+), 7 deletions(-)
diff --git a/src/Error.js b/src/Error.js
index 8c6d6a2b..db05aac3 100644
--- a/src/Error.js
+++ b/src/Error.js
@@ -9,16 +9,26 @@
* @param {Object} err CssSyntaxError
*/
class SyntaxError extends Error {
- constructor (err) {
- super(err)
+ constructor (error) {
+ super(error)
- const { line, column, reason } = err
+ const { line, column, reason } = error
this.name = 'SyntaxError'
- this.message = ''
- this.message += `${this.name} \n\n(${line}:${column}) ${reason}`
- this.message += `\n\n${err.showSourceCode()}\n`
+ this.message = `${this.name}\n\n`
+
+ if (typeof line !== 'undefined') {
+ this.message += `(${line}:${column}) `
+ }
+
+ this.message += `${reason}`
+
+ const code = error.showSourceCode()
+
+ if (code) {
+ this.message += `\n\n${code}\n`
+ }
this.stack = false
}
diff --git a/test/__snapshots__/Errors.test.js.snap b/test/__snapshots__/Errors.test.js.snap
index 117cc8c7..b3651a12 100644
--- a/test/__snapshots__/Errors.test.js.snap
+++ b/test/__snapshots__/Errors.test.js.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Errors Syntax Error 1`] = `
-"SyntaxError
+"SyntaxError
(1:3) Unexpected separator in property
From 313c3c458c431f13bc438b6780073a5644547b09 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 19:12:30 +0200
Subject: [PATCH 26/27] docs(README): update filename formatting
---
README.md | 45 ++++++++++++++++++++++++---------------------
1 file changed, 24 insertions(+), 21 deletions(-)
diff --git a/README.md b/README.md
index f7546968..6b03ad79 100644
--- a/README.md
+++ b/README.md
@@ -33,7 +33,7 @@ npm i -D postcss-loader
### `Configuration`
-**postcss.config.js**
+**`postcss.config.js`**
```js
module.exports = {
parser: 'sugarss',
@@ -72,7 +72,7 @@ Config lookup starts from `path.dirname(file)` and walks the file tree upwards u
After setting up your `postcss.config.js`, add `postcss-loader` to your `webpack.config.js`. You can use it standalone or in conjunction with `css-loader` (recommended). Use it **after** `css-loader` and `style-loader`, but **before** other preprocessor loaders like e.g `sass|less|stylus-loader`, if you use any.
-**webpack.config.js**
+**`webpack.config.js`**
```js
module.exports = {
module: {
@@ -88,7 +88,7 @@ module.exports = {
> ⚠️ When `postcss-loader` is used standalone (without `css-loader`) don't use `@import` in your CSS, since this can lead to quite bloated bundles
-**webpack.config.js (recommended)**
+**`webpack.config.js` (recommended)**
```js
module.exports = {
module: {
@@ -122,6 +122,7 @@ module.exports = {
If you use JS styles without the [`postcss-js`][postcss-js] parser, add the `exec` option.
+**`webpack.config.js`**
```js
{
test: /\.style.js$/,
@@ -148,7 +149,7 @@ You can manually specify the path to search for your config (`postcss.config.js`
> ⚠️ Note that you **can't** use a **filename** other than the [supported config formats] (e.g `.postcssrc.js`, `postcss.config.js`), this option only allows you to manually specify the **directory** where config lookup should **start** from
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
loader: 'postcss-loader',
@@ -173,7 +174,7 @@ You can manually specify the path to search for your config (`postcss.config.js`
`postcss-loader` exposes context `ctx` to the config file, making your `postcss.config.js` dynamic, so can use it to do some real magic ✨
-**postcss.config.js**
+**`postcss.config.js`**
```js
module.exports = ({ file, options, env }) => ({
parser: file.extname === '.sss' ? 'sugarss' : false,
@@ -185,7 +186,7 @@ module.exports = ({ file, options, env }) => ({
})
```
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
loader: 'postcss-loader',
@@ -202,7 +203,7 @@ module.exports = ({ file, options, env }) => ({
### `Plugins`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
loader: 'postcss-loader',
@@ -229,7 +230,7 @@ module.exports = ({ file, options, env }) => ({
#### `Parser`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.sss$/,
@@ -242,7 +243,7 @@ module.exports = ({ file, options, env }) => ({
#### `Syntax`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css$/,
@@ -255,7 +256,7 @@ module.exports = ({ file, options, env }) => ({
#### `Stringifier`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css$/,
@@ -270,7 +271,7 @@ module.exports = ({ file, options, env }) => ({
Enables source map support, `postcss-loader` will use the previous source map given by other loaders and update it accordingly, if no previous loader is applied before `postcss-loader`, the loader will generate a source map for you.
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css/,
@@ -288,7 +289,7 @@ Enables source map support, `postcss-loader` will use the previous source map gi
You can set the `sourceMap: 'inline'` option to inline the source map
within the CSS directly as an annotation comment.
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
loader: 'postcss-loader',
@@ -308,7 +309,7 @@ within the CSS directly as an annotation comment.
### `Stylelint`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css$/,
@@ -330,9 +331,9 @@ within the CSS directly as an annotation comment.
}
```
-### Autoprefixing
+### `Autoprefixing`
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css$/,
@@ -361,7 +362,7 @@ This loader [cannot be used] with [CSS Modules] out of the box due
to the way `css-loader` processes file imports. To make them work properly,
either add the css-loader’s [`importLoaders`] option.
-**webpack.config.js**
+**`webpack.config.js`**
```js
{
test: /\.css$/,
@@ -386,6 +387,7 @@ If you want to process styles written in JavaScript, use the [postcss-js] parser
[postcss-js]: https://github.com/postcss/postcss-js
+**`webpack.config.js`**
```js
{
test: /\.style.js$/,
@@ -425,10 +427,11 @@ export default {
[ExtractPlugin]: https://github.com/webpack-contrib/mini-css-extract-plugin
-**webpack.config.js**
+**`webpack.config.js`**
```js
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-const devMode = process.env.NODE_ENV !== 'production';
+const devMode = process.env.NODE_ENV !== 'production'
+
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = {
module: {
@@ -438,14 +441,14 @@ module.exports = {
use: [
devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
'css-loader',
- 'postcss-loader',
+ 'postcss-loader'
]
}
]
},
plugins: [
new MiniCssExtractPlugin({
- filename: devMode ? '[name].css' : '[name].[hash].css',
+ filename: devMode ? '[name].css' : '[name].[hash].css'
})
]
}
From 7647ac9051a17a3a6add7364828bf7bd9955b968 Mon Sep 17 00:00:00 2001
From: Michael Ciniawsky
Date: Wed, 8 Aug 2018 19:42:27 +0200
Subject: [PATCH 27/27] chore(release): 3.0.0
---
CHANGELOG.md | 22 ++++++++++++++++++++++
package.json | 2 +-
2 files changed, 23 insertions(+), 1 deletion(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 326af73a..fcdcebb3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,28 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+
+# [3.0.0](https://github.com/postcss/postcss-loader/compare/v2.1.6...v3.0.0) (2018-08-08)
+
+
+### Bug Fixes
+
+* **index:** add ast version (`meta.ast`) ([f34954f](https://github.com/postcss/postcss-loader/commit/f34954f))
+* **index:** emit `warnings` as an instance of `{Error}` ([8ac6fb5](https://github.com/postcss/postcss-loader/commit/8ac6fb5))
+* **options:** improved `ValidationError` messages ([549ea08](https://github.com/postcss/postcss-loader/commit/549ea08))
+
+
+### Chores
+
+* **package:** update `postcss` v6.0.0...7.0.0 (`dependencies`) ([#375](https://github.com/postcss/postcss-loader/issues/375)) ([daa0da8](https://github.com/postcss/postcss-loader/commit/daa0da8))
+
+
+### BREAKING CHANGES
+
+* **package:** requires `node >= v6.0.0`
+
+
+
## [2.1.6](https://github.com/postcss/postcss-loader/compare/v2.1.5...v2.1.6) (2018-07-10)
diff --git a/package.json b/package.json
index 0ebf1bbb..0a317336 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "postcss-loader",
- "version": "2.1.6",
+ "version": "3.0.0",
"description": "PostCSS loader for webpack",
"main": "src/index.js",
"files": [