Initial bit of prettier, with recommended .prettierrc

[robert-j-webb]

Note: I only ran prettier on src/core. The reason for this is that this prettier config will mangle some code.

It is not the fault of a single prettier plugin, or the prettier version. Instead, it is when 3 plugins are used together that this issue happens.

It is kind of difficult to describe - you can see the error on the bash language definition. I just ran this:

npx prettier src/languages/prism-bash.ts --write

Additionally, I did not want to work super hard on forming eslint to the prettier config until we committed to this approach. I would love feedback.

[netlify]

✅ Deploy Preview for prismjs-com ready!

Name	Link
🔨 Latest commit	f390aec
🔍 Latest deploy log	https://app.netlify.com/sites/prismjs-com/deploys/67e47dc494009b000886e9ca
😎 Deploy Preview	https://deploy-preview-3876--prismjs-com.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[github-actions]

No JS Changes

Generated by 🚫 dangerJS against f390aec

[DmitrySharabin]

It is kind of difficult to describe - you can see the error on the bash language definition. I just ran this:

npx prettier src/languages/prism-bash.ts --write

It seems like this file is broken. For example, on line 166, there is not enough code. Here is what is supposed to be there:

prism/components/prism-bash.js

Lines 154 to 161 in 76dde18

	{
	// https://www.gnu.org/software/bash/manual/html_node/ANSI_002dC-Quoting.html
	pattern: /\$'(?:[^'\\]|\\[\s\S])*'/,
	greedy: true,
	inside: {
	'entity': insideString.entity
	}
	}

And everything starting from line 243 should be deleted: it's a fragment of the code above.

With these two changes, the file will be read and parsed correctly.

[robert-j-webb]

It is kind of difficult to describe - you can see the error on the bash language definition. I just ran this:
npx prettier src/languages/prism-bash.ts --write

It seems like this file is broken. For example, on line 166, there is not enough code. Here is what is supposed to be there:

prism/components/prism-bash.js

Lines 154 to 161 in 76dde18

	{
	// https://www.gnu.org/software/bash/manual/html_node/ANSI_002dC-Quoting.html
	pattern: /\$'(?:[^'\\]|\\[\s\S])*'/,
	greedy: true,
	inside: {
	'entity': insideString.entity
	}
	}

And everything starting from line 243 should be deleted: it's a fragment of the code above.

With these two changes, the file will be read and parsed correctly.

Yes now it's working. I think the v0.0.5 prettier-plugin-space-before-function-paren version I was using was causing the mangling.

[robert-j-webb]

I ran prettier on all files (besides /website) and it worked without error. I didn't commit anything because I didn't want to make the PR unreadable.

[DmitrySharabin]

I think the v0.0.5 prettier-plugin-space-before-function-paren version I was using was causing the mangling.

I wouldn't have expected it to be so severe. 😱 My test didn't show that, but I can't deny I might have missed something.

[robert-j-webb]

Ok I have added a PR that actually runs Prettier on everything:

robert-j-webb#1

It ran into an issue where it was mangling script/build.ts.

Note it's based off the branch of current PR

[LeaVerou]

Finally found some time to review this, thanks everyone for your patience!

Some small tweaks and we're ready to go. I’ve left some comments on the diff.

Some additional comments:

• If we're using Prettier, we should remove any rules from ESLint that are covered by Prettier, or ditch it entirely. I'm fine with either of these options, but currently we have rules in eslintrc that are covered by Prettier (e.g. curly)

Not strictly related with this PR, just some things I noticed when going through the diff:

• I think we should ditch babel & minification in v2. If folks want to transpile or minify they can do their own transformations (which for minification is AFAIK the currently recommended way, as minifying twice is a recipe for bugs)
• I wonder if we could switch the language definitions back to JS. Their use of types is minimal, and TS imposes barriers to contributions, and these are the most frequently contributed files.

[LeaVerou]

Non-blocking, but it would be nice if we could import our Prettier config here (and remove the plugins via JS since they don't work with sync prettier), instead of duplicating it.

[robert-j-webb]

I think the plugins still work with sync prettier, I just ran it with tests and it seems totally fine.

[robert-j-webb]

Ok, most recent update - to make things less confusing, I removed any formatting of src/core/* - all of that will be in the follow up to make things more clear - if you want to see how formatting is changing files, check out the other PR which I have just updated with the new config

Everything is now up to date and working! thanks so much for the feedback.

• If we're using Prettier, we should remove any rules from ESLint that are covered by Prettier, or ditch it entirely. I'm fine with either of these options, but currently we have rules in eslintrc that are covered by Prettier (e.g. curly)

Done!

[LeaVerou]

LGTM! Thanks for your patience everyone.

Non-blocking: We may want to add a .vscode/settings.json with:

{
	"editor.formatOnSave": true,
	"editor.defaultFormatter": "esbenp.prettier-vscode",
	"prettier.enable": true,
}

That way, folks that don't have Prettier enabled by default, can still use it.