Skip to content
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.

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

add plugin id help for config's #103

Conversation

romainmenke
Copy link
Member

@romainmenke romainmenke commented Jan 1, 2022

partial fix for : csstools/postcss-preset-env#156

Also see : #86 (reply in thread)

Uses a levenshtein distance to possibly suggest the correct plugin.

options: {
	features: {
		"custom-media": true,
		"postcss-logical": true,
		"postcss-logica": true,
	}
},
Unknown feature: "custom-media" did you mean: "custom-media-queries"
Unknown feature: "postcss-logical" did you mean: "logical-properties-and-values"
Unknown feature: "postcss-logica" did you mean: "logical-properties-and-values"

Tests failed because we still had some that were using color-mod and this then throw warnings with the new help stuff.

Maybe the entire insertBefore insertAfter stuff is outdated since this is no longer of PostCSS plugins run? But this is outside the scope of this change.

@@ -113,14 +115,24 @@ const plugin = opts => {
const usedPlugins = supportedFeatures.map(feature => feature.plugin);
usedPlugins.push(stagedAutoprefixer);

const internalPlugin = () => {
Copy link
Member Author

Choose a reason for hiding this comment

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

This was broken.
It's not possible to have both OnceExit and plugins in the same PostCSS plugin.

These need to be chained.

I do not know the exportsTo plugin so I can't easily add a test for it to double check that everything is fine now.

Copy link
Member

@Antonio-Laguna Antonio-Laguna left a comment

Choose a reason for hiding this comment

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

Thanks for this! This is great and I think it'll help in the future to ease the plugin pack usage. Just left a minor comment. I'm sure I'm missing something.

Comment on lines -1 to 3
$font: system-ui;

.test-variable {
font-family: $font;
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
}
Copy link
Member

Choose a reason for hiding this comment

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

This change confuses me a bit. Why is this needed?

Copy link
Member Author

Choose a reason for hiding this comment

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

It confused me too.

tape contents for this test :

	'insert:after:array': {
		message: 'supports { stage: 1, after: { "lab-function": [ require("postcss-simple-vars") ] } } usage',
		options: {
			stage: 1,
			insertAfter: {
				'lab-function': [
					require('postcss-simple-vars')()
				]
			},
			features: {
				'lab-function': {
					unresolved: 'ignore'
				}
			}
		},
		expect: 'insert.after.expect.css'
	},

I replaced the color-mod stuff with lab-function to resolve the warnings.
I think that insertAfter looks up the index of the plugin (lab-function) and tries to add the other plugin after it.

If the feature is not found I think it was never inserted.

So when color-mod was removed postcss-simple-vars was no longer applied correctly in this test.

Now that I have changed it to lab-function it actually works again.
Although probably not as designed because of plugins not having an order in PostCSS 8

Copy link
Member

Choose a reason for hiding this comment

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

Hmm we should probably add another issue to test this meaningfully since I don't think this test proves anything right now

@@ -11,6 +11,10 @@ export function pluginIdHelp(featureNamesInOptions, root, result) {
const byId = mostSimilar(featureName, featureNames);
const byPackage = mostSimilar(featureName, packageNames);

// TODO :
// 1. create markdown docs with the plugin id's
Copy link
Member Author

Choose a reason for hiding this comment

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

outside of scope of this change.
But I want to already indicate were in the code this can be mentioned to users.

@Antonio-Laguna Antonio-Laguna merged commit 609986a into main Jan 1, 2022
@Antonio-Laguna Antonio-Laguna deleted the add-plugin-id-help-for-config--empathetic-humpback-whale-326a3ee971 branch January 1, 2022 21:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants