Skip to content

fix: compatibility with postcss@8 #479

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 15, 2020
Merged

fix: compatibility with postcss@8 #479

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1,740 changes: 1,578 additions & 162 deletions package-lock.json
View file
Open in desktop

Large diffs are not rendered by default.

8 changes: 4 additions & 4 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
],
"peerDependencies": {
"webpack": "^4.0.0 || ^5.0.0",
"postcss": "^7.0.0"
"postcss": "^7.0.0 || ^8.0.1"
Copy link
Member Author

@alexander-akait alexander-akait Sep 15, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

postcss 8.0.0 has bug with reusing AST due invalid version on processor, fixed in 8.0.1

},
"dependencies": {
"cosmiconfig": "^7.0.0",
Expand All @@ -61,7 +61,7 @@
"cssnano": "^4.1.10",
"del": "^5.1.0",
"del-cli": "^3.0.1",
"eslint": "^7.8.1",
"eslint": "^7.9.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.22.0",
"husky": "^4.3.0",
Expand All @@ -72,11 +72,11 @@
"memfs": "^3.2.0",
"midas": "^2.0.3",
"npm-run-all": "^4.1.5",
"postcss": "^7.0.32",
"postcss": "^8.0.1",
"postcss-dark-theme-class": "^0.4.0",
"postcss-import": "^12.0.1",
"postcss-js": "^2.0.0",
"postcss-nested": "^4.2.3",
"postcss-rtl": "^1.7.3",
"postcss-short": "^5.0.0",
"prettier": "^2.1.1",
"sass": "^1.26.10",
Expand Down
34 changes: 27 additions & 7 deletions test/__snapshots__/postcssOptins.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -367,15 +367,35 @@ Object {
exports[`"postcssOptions" option should work with the "config" options and resolve "from" and "to" options: warnings 1`] = `Array []`;

exports[`"postcssOptions" option should work with the "config" options and use plugins: css 1`] = `
"a { color: rgba(0, 0, 0, 1.0) }
"a { color: black }

[dir=ltr] .foo { float: right;
.foo {
float: right;
}

[dir=rtl] .foo {
float: left;
.bar {
border-top-color: blue;
border-right-color: blue;
border-left-color: blue;
background-color: #fafafa;
}
"

@media (prefers-color-scheme: dark) {
:root:not(.is-light) { /* :root is <html> for HTML documents */
--text-color: white
}
html:not(.is-light) body {
background: black
}
}

:root.is-dark { /* :root is <html> for HTML documents */
--text-color: white
}

html.is-dark body {
background: black
}"
`;

exports[`"postcssOptions" option should work with the "config" options and use plugins: errors 1`] = `Array []`;
Expand Down Expand Up @@ -739,13 +759,13 @@ a {
}

.phone_title {
width: 500px;
width: 100px;
}

@media (max-width: 500px) {

.phone_title {
width: auto
width: 100px
}
}

Expand Down
3 changes: 3 additions & 0 deletions test/fixtures/config-scope/with-config/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import style from './style.css'

export default style
5 changes: 5 additions & 0 deletions test/fixtures/config-scope/with-config/postcss.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
module.exports = function () {
return {
plugins: [['postcss-short', { prefix: 'x' }]],
}
};
19 changes: 19 additions & 0 deletions test/fixtures/config-scope/with-config/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
a { color: black }

.foo {
float: right;
}

.bar {
-x-border-color: blue blue *;
-x-color: * #fafafa;
}

@media (prefers-color-scheme: dark) {
:root { /* :root is <html> for HTML documents */
--text-color: white
}
body {
background: black
}
}
11 changes: 11 additions & 0 deletions test/fixtures/plugin/new-api.plugin.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
module.exports = (opts = {}) => {
return {
postcssPlugin: 'postcss-new-api-plugin',
Declaration: {
width: (node) => {
node.value = '100px';
},
},
};
};
module.exports.postcss = true;
5 changes: 5 additions & 0 deletions test/loader.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ describe('loader', () => {
it('should throw an error on invalid syntax', async () => {
const compiler = getCompiler('./css/index.js', {
postcssOptions: {
hideNothingWarning: true,
parser: 'sugarss',
},
});
Expand Down Expand Up @@ -97,6 +98,9 @@ describe('loader', () => {
},
{
loader: path.resolve(__dirname, '../src'),
options: {
postcssOptions: { hideNothingWarning: true },
},
},
{
loader: require.resolve('./helpers/astLoader'),
Expand All @@ -121,6 +125,7 @@ describe('loader', () => {
const compiler = getCompiler('./sss/index.js', {
postcssOptions: {
parser: 'sugarss',
hideNothingWarning: true,
},
});
const stats = await compile(compiler);
Expand Down
6 changes: 4 additions & 2 deletions test/postcssOptins.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -343,6 +343,8 @@ describe('"postcssOptions" option', () => {
require.resolve('./fixtures/plugin/other-plugin'),
myPostcssPlugin({ color: 'white', alpha: 0 }),
{ 'postcss-short': { prefix: 'z' } },
// New API
require.resolve('./fixtures/plugin/new-api.plugin'),
],
},
});
Expand Down Expand Up @@ -685,10 +687,10 @@ describe('"postcssOptions" option', () => {
});

it('should work with the "config" options and use plugins', async () => {
const compiler = getCompiler('./config-scope/css/index.js', {
const compiler = getCompiler('./config-scope/with-config/index.js', {
postcssOptions: {
config: true,
plugins: ['postcss-rtl'],
plugins: ['postcss-dark-theme-class'],
},
});
const stats = await compile(compiler);
Expand Down
27 changes: 22 additions & 5 deletions test/sourceMap.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ describe('"sourceMap" option', () => {
'./css/index.js',
{
sourceMap: true,
postcssOptions: { hideNothingWarning: true },
},
{
devtool: false,
Expand Down Expand Up @@ -51,6 +52,7 @@ describe('"sourceMap" option', () => {
'./css/index.js',
{
sourceMap: true,
postcssOptions: { hideNothingWarning: true },
},
{
devtool: 'source-map',
Expand Down Expand Up @@ -81,7 +83,9 @@ describe('"sourceMap" option', () => {
it('should generate source maps when value is not specified and the "devtool" with "source-map" value', async () => {
const compiler = getCompiler(
'./css/index.js',
{},
{
postcssOptions: { hideNothingWarning: true },
},
{
devtool: 'source-map',
}
Expand Down Expand Up @@ -119,6 +123,7 @@ describe('"sourceMap" option', () => {
prev: false,
sourcesContent: true,
},
hideNothingWarning: true,
},
},
{
Expand Down Expand Up @@ -165,6 +170,7 @@ describe('"sourceMap" option', () => {
options: {
postcssOptions: {
map: true,
hideNothingWarning: true,
},
},
},
Expand Down Expand Up @@ -228,6 +234,7 @@ describe('"sourceMap" option', () => {
sourcesContent: true,
annotation: true,
},
hideNothingWarning: true,
},
},
},
Expand Down Expand Up @@ -282,6 +289,7 @@ describe('"sourceMap" option', () => {
'./css/index.js',
{
sourceMap: false,
postcssOptions: { hideNothingWarning: true },
},
{
devtool: false,
Expand All @@ -301,6 +309,7 @@ describe('"sourceMap" option', () => {
'./css/index.js',
{
sourceMap: false,
postcssOptions: { hideNothingWarning: true },
},
{
devtool: 'source-map',
Expand All @@ -318,7 +327,9 @@ describe('"sourceMap" option', () => {
it('should not generate source maps when value is not specified and the "devtool" option with "source-map" value', async () => {
const compiler = getCompiler(
'./css/index.js',
{},
{
postcssOptions: { hideNothingWarning: true },
},
{
devtool: false,
}
Expand Down Expand Up @@ -348,6 +359,9 @@ describe('"sourceMap" option', () => {
},
{
loader: path.resolve(__dirname, '../src'),
options: {
postcssOptions: { hideNothingWarning: true },
},
},
{
loader: 'sass-loader',
Expand Down Expand Up @@ -387,9 +401,7 @@ describe('"sourceMap" option', () => {
it('should generate source maps when previous loader returns source maps ("less-loader")', async () => {
const compiler = getCompiler(
'./less/index.js',
{
config: false,
},
{},
{
devtool: 'source-map',
module: {
Expand All @@ -403,6 +415,9 @@ describe('"sourceMap" option', () => {
},
{
loader: path.resolve(__dirname, '../src'),
options: {
postcssOptions: { hideNothingWarning: true },
},
},
{
loader: 'less-loader',
Expand Down Expand Up @@ -444,6 +459,7 @@ describe('"sourceMap" option', () => {
inline: true,
annotation: false,
},
hideNothingWarning: true,
},
},
{
Expand All @@ -467,6 +483,7 @@ describe('"sourceMap" option', () => {
inline: true,
annotation: false,
},
hideNothingWarning: true,
},
},
{
Expand Down