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

fix: require optional dependencies conditionally #7549

Merged
merged 1 commit into from
Nov 10, 2022

Conversation

caugner
Copy link
Contributor

@caugner caugner commented Nov 10, 2022

Summary

Should fix the failing check when bumping yari in mdn/content mdn/content#22218.

Problem

#7430 changed the way we import dependencies by moving from require to import, and import statements cannot be imported conditionally, because they must appear at the top of the file. However, when importing (or requireing) an optional dependency (e.g. a devDepencency) unconditionally, this will cause an error.

Specifically, we require prettier and webpack, which are available when developing yari, but not when using yari as part of mdn/content.

PS: ESLint actually complains about this via the n/no-unpublished-import rule, but we don't currently run ESLint on TypeScript until #7454 lands and that PR has that rule disabled.

Solution

When using (dev) dependencies, use a conditional require instead of import.

PS: Migrating to ESM would allow us to use await import("webpack") instead, but we're not there yet.


Screenshots

n/a


How did you test this change?

Relying on tests.

@caugner caugner requested a review from queengooborg November 10, 2022 16:38
@caugner caugner marked this pull request as ready for review November 10, 2022 16:39
prettier and webpack are only available in dev environment.
@caugner caugner force-pushed the dont-import-optional-deps branch from 1febbdf to a1560f6 Compare November 10, 2022 16:39
@caugner caugner changed the title fix: require optional dependency conditionally fix: require optional dependencies conditionally Nov 10, 2022
@@ -107,7 +105,8 @@ export function execGit(args, opts: { cwd?: string } = {}, root = null) {
export function toPrettyJSON(value) {
const json = JSON.stringify(value, null, 2) + "\n";
try {
return prettier.format(json, { parser: "json" });
// eslint-disable-next-line n/no-unpublished-require
return require("prettier").format(json, { parser: "json" });
Copy link
Collaborator

Choose a reason for hiding this comment

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

Could we use await import("prettier") instead, just to keep everything ESM?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

We could, if we would set module in tsconfig.json, but we haven't yet figured out how to make this work, see #7548 for example.

@caugner caugner merged commit 5566959 into main Nov 10, 2022
@caugner caugner deleted the dont-import-optional-deps branch November 10, 2022 16:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants