Upgrade to postcss 8, update dependencies (#15)

* Upgrade to postcss 8 * remove prettier related code
csstools · Feb 10, 2022 · 3c770b6 · 3c770b6
1 parent 2a77465
commit 3c770b6
Show file tree

Hide file tree

Showing 6 changed files with 170 additions and 184 deletions.
diff --git a/.rollup.js b/.rollup.js
@@ -3,13 +3,13 @@ import babel from 'rollup-plugin-babel';
 export default {
 	input: 'src/index.js',
 	output: [
-		{ file: 'index.js', format: 'cjs', sourcemap: true, strict: false },
-		{ file: 'index.mjs', format: 'esm', sourcemap: true, strict: false }
+		{ file: 'index.js', format: 'cjs', sourcemap: true, strict: false, exports: 'auto' },
+		{ file: 'index.mjs', format: 'esm', sourcemap: true, strict: false, exports: 'auto' }
 	],
 	plugins: [
 		babel({
 			presets: [
-				['@babel/env', { modules: false, targets: { node: 8 } }]
+				['@babel/env', { modules: false, targets: { node: 12 } }]
 			]
 		})
 	]

diff --git a/.tape.js b/.tape.js
@@ -3,104 +3,80 @@ const postcssNesting = require('postcss-nesting');
 const postcssExtends = require('.');
 
 module.exports = {
-		'basic': {
-			message: 'supports @extend usage'
+	'basic': {
+		message: 'supports @extend usage'
+	},
+	'basic:name': {
+		message: 'ignores @extend usage when { name: "postcss-extend" }',
+		options: {
+			name: 'postcss-extend'
 		},
-		'basic:name': {
-			message: 'ignores @extend usage when { name: "postcss-extend" }',
-			options: {
-				name: 'postcss-extend'
-			},
-			expect: 'basic.css'
+		expect: 'basic.css'
+	},
+	'basic-postcss-name': {
+		message: 'supports @postcss-extend when { name: "postcss-extend" }',
+		options: {
+			name: 'postcss-extend'
 		},
-		'basic-postcss-name': {
-			message: 'supports @postcss-extend when { name: "postcss-extend" }',
-			options: {
-				name: 'postcss-extend'
-			},
-			expect: 'basic.expect.css'
-		},
-		'basic.button': {
-			message: 'supports @extend usage with same tag name and class name',
-			expect: 'basic.button.expect.css'
-		},
-		'advanced': {
-			message: 'supports mixed usage (with postcss-nesting)',
-			plugin: postcss.plugin('postcss-extend-rule', () => {
-				const extendsTransformer = postcssExtends();
-				const nestingTransformer = postcssNesting();
-
-				return (...args) => {
-					nestingTransformer(...args);
-					extendsTransformer(...args);
-				};
-			})
-		},
-		'nested-media': {
-			'message': 'supports nested @media usage'
-		},
-		'nested-media:nesting-first': {
-			'message': 'supports nested @media usage when postcss-nesting runs first',
-			plugin: postcss.plugin('postcss-extend-rule', () => {
-				const extendsTransformer = postcssExtends();
-				const nestingTransformer = postcssNesting();
-
-				return (...args) => {
-					nestingTransformer(...args);
-					extendsTransformer(...args);
-				};
-			})
-		},
-		'nested-media:nesting-second': {
-			'message': 'supports nested @medi usage when postcss-nesting runs second',
-			plugin: postcss.plugin('postcss-extend-rule', () => {
-				const extendsTransformer = postcssExtends();
-				const nestingTransformer = postcssNesting();
-
-				return (...args) => {
-					extendsTransformer(...args);
-					nestingTransformer(...args);
-				};
-			})
-		},
-		'error': {
-			message: 'manages error-ridden usage'
-		},
-		'error:ignore': {
-			message: 'manages error-ridden usage with { onFunctionalSelector: "ignore", onRecursiveExtend: "ignore", onUnusedExtend: "ignore" } options',
-			options: {
-				onFunctionalSelector: 'ignore',
-				onRecursiveExtend: 'ignore',
-				onUnusedExtend: 'ignore'
-			}
+		expect: 'basic.expect.css'
+	},
+	'basic.button': {
+		message: 'supports @extend usage with same tag name and class name',
+		expect: 'basic.button.expect.css'
+	},
+	'advanced': {
+		message: 'supports mixed usage (with postcss-nesting)',
+		plugin: postcss(postcssNesting, postcssExtends)
+	},
+	'nested-media': {
+		'message': 'supports nested @media usage'
+	},
+	'nested-media:nesting-first': {
+		'message': 'supports nested @media usage when postcss-nesting runs first',
+		plugin: postcss(postcssNesting, postcssExtends)
+	},
+	'nested-media:nesting-second': {
+		'message': 'supports nested @media usage when postcss-nesting runs second',
+		plugin: postcss(postcssExtends, postcssNesting)
+	},
+	'error': {
+		message: 'manages error-ridden usage'
+	},
+	'error:ignore': {
+		message: 'manages error-ridden usage with { onFunctionalSelector: "ignore", onRecursiveExtend: "ignore", onUnusedExtend: "ignore" } options',
+		options: {
+			onFunctionalSelector: 'ignore',
+			onRecursiveExtend: 'ignore',
+			onUnusedExtend: 'ignore'
+		}
+	},
+	'error:warn': {
+		message: 'manages error-ridden usage with { onFunctionalSelector: "warn", onRecursiveExtend: "warn", onUnusedExtend: "warn" } options',
+		options: {
+			onFunctionalSelector: 'warn',
+			onRecursiveExtend: 'warn',
+			onUnusedExtend: 'warn'
 		},
-		'error:warn': {
-			message: 'manages error-ridden usage with { onFunctionalSelector: "warn", onRecursiveExtend: "warn", onUnusedExtend: "warn" } options',
-			options: {
-				onFunctionalSelector: 'warn',
-				onRecursiveExtend: 'warn',
-				onUnusedExtend: 'warn'
-			},
-			warnings: 2
+		warnings: 2
+	},
+	'error:throw': {
+		message: 'manages error-ridden usage with { onFunctionalSelector: "throw", onRecursiveExtend: "throw", onUnusedExtend: "throw" } options',
+		options: {
+			onFunctionalSelector: 'throw',
+			onRecursiveExtend: 'throw',
+			onUnusedExtend: 'throw'
 		},
-		'error:throw': {
-			message: 'manages error-ridden usage with { onFunctionalSelector: "throw", onRecursiveExtend: "throw", onUnusedExtend: "throw" } options',
-			options: {
-				onFunctionalSelector: 'throw',
-				onRecursiveExtend: 'throw',
-				onUnusedExtend: 'throw'
-			},
-			error: {
-				reason: 'Unused extend at-rule "some-non-existent-selector"'
-			}
+		error: {
+			reason: 'Unused extend at-rule "some-non-existent-selector"'
+		}
+	},
+	'error:throw-on-functional-selectors': {
+		message: 'manages error-ridden usage with { onFunctionalSelector: "throw" } options',
+		options: {
+			onFunctionalSelector: 'throw'
 		},
-		'error:throw-on-functional-selectors': {
-			message: 'manages error-ridden usage with { onFunctionalSelector: "throw" } options',
-			options: {
-				onFunctionalSelector: 'throw'
-			},
-			error: {
-				reason: 'Encountered functional selector "%test-placeholder"'
-			}
+		error: {
+			reason: 'Encountered functional selector "%test-placeholder"'
 		}
+	}
 };
diff --git a/.travis.yml b/.travis.yml
@@ -3,7 +3,7 @@
 language: node_js
 
 node_js:
-  - 8
+  - 12
 
 install:
   - npm install --ignore-scripts
diff --git a/README.md b/README.md
@@ -60,7 +60,7 @@
 Add [PostCSS Extend Rule] to your project:
 
 ```bash
-npm install postcss-extend-rule --save-dev
+npm install postcss postcss-extend-rule --save-dev
 ```
 
 Use **PostCSS Extend Rule** to process your CSS:

diff --git a/package.json b/package.json
@@ -24,21 +24,27 @@
     "test:tape": "postcss-tape"
   },
   "engines": {
-    "node": ">=8.0.0"
+    "node": "^12 || ^14 || >=16"
   },
   "dependencies": {
-    "postcss": "^7.0.17",
-    "postcss-nesting": "^7.0.1",
-    "postcss-tape": "^5.0.2"
+    "postcss-nesting": "^10.1.2",
+    "postcss-tape": "^6.0.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.5.5",
-    "@babel/preset-env": "^7.5.5",
-    "babel-eslint": "^10.0.2",
-    "eslint": "^6.1.0",
+    "@babel/core": "^7.16.12",
+    "@babel/preset-env": "^7.16.11",
+    "@babel/eslint-parser": "^7.16.5",
+    "eslint": "^8.8.0",
+    "postcss": "^8.4.5",
     "pre-commit": "^1.2.2",
-    "rollup": "^1.17.0",
-    "rollup-plugin-babel": "^4.3.3"
+    "rollup": "^2.66.1",
+    "rollup-plugin-babel": "^4.4.0"
+  },
+  "peerDependencies": {
+    "postcss": "^8.4.5"
+  },
+  "postcssConfig": {
+    "config": ".tape.js"
   },
   "eslintConfig": {
     "env": {
@@ -47,11 +53,12 @@
       "node": true
     },
     "extends": "eslint:recommended",
-    "parser": "babel-eslint",
+    "parser": "@babel/eslint-parser",
     "parserOptions": {
       "ecmaVersion": 2018,
       "impliedStrict": true,
-      "sourceType": "module"
+      "sourceType": "module",
+      "requireConfigFile": false
     },
     "root": true
   },