Skip to content

Commit

Permalink
Suggest using BABEL_SHOW_CONFIG_FOR for config problems
Browse files Browse the repository at this point in the history
  • Loading branch information
nicolo-ribaudo committed Jan 22, 2024
1 parent eccbd20 commit 36fe828
Show file tree
Hide file tree
Showing 24 changed files with 246 additions and 34 deletions.
7 changes: 6 additions & 1 deletion packages/babel-core/src/parser/index.ts
Expand Up @@ -66,7 +66,12 @@ export default function* parser(
if (missingPlugin) {
err.message =
`${filename}: ` +
generateMissingPluginMessage(missingPlugin[0], loc, codeFrame);
generateMissingPluginMessage(
missingPlugin[0],
loc,
codeFrame,
filename,
);
} else {
err.message = `${filename}: ${err.message}\n\n` + codeFrame;
}
Expand Down
13 changes: 13 additions & 0 deletions packages/babel-core/src/parser/util/missing-plugin-helper.ts
Expand Up @@ -318,6 +318,7 @@ export default function generateMissingPluginMessage(
column: number;
},
codeFrame: string,
filename: string,
): string {
let helpMessage =
`Support for the experimental syntax '${missingPluginName}' isn't currently enabled ` +
Expand All @@ -342,5 +343,17 @@ If you want to leave it as-is, add ${syntaxPluginInfo} to the 'plugins' section
}
}
}

const msgFilename =
filename === "unknown" ? "<name of the input file>" : filename;
helpMessage += `
If you already added the plugin for this syntax to your config, it's possible that your config \
isn't being loaded.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded \
configuration:
\tnpx cross-env BABEL_SHOW_CONFIG_FOR=${msgFilename} ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
`;
return helpMessage;
}
30 changes: 18 additions & 12 deletions packages/babel-core/test/api.js
Expand Up @@ -906,23 +906,29 @@ describe("api", function () {
});
});

it("both syntax and transform plugin available", function () {
return new Promise(resolve => {
it("both syntax and transform plugin available", async function () {
const promise = new Promise((resolve, reject) => {
transformFile(
cwd + "/fixtures/api/parsing-errors/syntax-and-transform/file.js",
options,
function (err) {
expect(err.message).toMatch(
"Support for the experimental syntax 'doExpressions' isn't currently enabled (1:2):",
);
expect(err.message).toMatch(
"Add @babel/plugin-proposal-do-expressions (https://github.com/babel/babel/tree/main/packages/babel-plugin-proposal-do-expressions) to the " +
"'plugins' section of your Babel config to enable transformation.",
);
resolve();
},
(err, result) => (err ? reject(err) : resolve(result)),
);
});

await expect(promise).rejects.toThrow();

const err = await promise.catch(e => e);

expect(err.message).toMatch(
"Support for the experimental syntax 'doExpressions' isn't currently enabled (1:2):",
);
expect(err.message).toMatch(
"Add @babel/plugin-proposal-do-expressions (https://github.com/babel/babel/tree/main/packages/babel-plugin-proposal-do-expressions) to the " +
"'plugins' section of your Babel config to enable transformation.",
);
expect(err.message).toMatch(
/You can re-run Babel with the BABEL_SHOW_CONFIG_FOR=(.*?)[\\/]parsing-errors[\\/]syntax-and-transform[\\/]file.js environment variable to show the loaded configuration./,
);
});
});

Expand Down
22 changes: 20 additions & 2 deletions packages/babel-helper-create-class-features-plugin/src/features.ts
Expand Up @@ -94,7 +94,9 @@ export function enableFeature(file: File, feature: number, loose: boolean) {
throw new Error(
"'loose' mode configuration must be the same for @babel/plugin-transform-class-properties, " +
"@babel/plugin-transform-private-methods and " +
"@babel/plugin-transform-private-property-in-object (when they are enabled).",
"@babel/plugin-transform-private-property-in-object (when they are enabled)." +
"\n\n" +
getBabelShowConfigForHint(file),
);
} else {
resolvedLoose = loose;
Expand All @@ -118,13 +120,29 @@ export function enableFeature(file: File, feature: number, loose: boolean) {
`and @babel/plugin-transform-private-property-in-object (when they are enabled): you can ` +
`silence this warning by explicitly adding\n` +
`\t["${name}", { "loose": ${resolvedLoose} }]\n` +
`to the "plugins" section of your Babel config.`,
`to the "plugins" section of your Babel config.` +
"\n\n" +
getBabelShowConfigForHint(file),
);
}
}
}
}

function getBabelShowConfigForHint(file: File) {
let { filename } = file.opts;
if (!filename || filename === "unknown") {
filename = "[name of the input file]";
}
return `\
If you already set the same 'loose' mode for these plugins in your config, it's possible that they \
are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded \
configuration:
\tnpx cross-env BABEL_SHOW_CONFIG_FOR=${filename} ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.`;
}

function hasFeature(file: File, feature: number) {
return !!(file.get(featuresKey) & feature);
}
Expand Down
@@ -0,0 +1,5 @@
class A {
x = 2;

#foo() {}
}
@@ -0,0 +1,15 @@
{
"BABEL_8_BREAKING": false,
"os": ["win32"],
"validateLogs": true,
"presets": [
[
"env",
{
"targets": { "node": 10 },
"shippedProposals": true
}
]
],
"plugins": [["proposal-private-methods", { "loose": true }]]
}
@@ -0,0 +1,17 @@
var id = 0;

function _classPrivateFieldLooseKey(name) { return "__private_" + id++ + "_" + name; }

var _foo = _classPrivateFieldLooseKey("foo");

class A {
constructor() {
Object.defineProperty(this, _foo, {
value: _foo2
});
this.x = 2;
}

}

var _foo2 = function _foo2() {};
@@ -0,0 +1,5 @@
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-class-properties since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-methods.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-proposal-class-properties", { "loose": true }]
to the "plugins" section of your Babel config.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR=<CWD>\packages\babel-preset-env\test\fixtures\loose-class-features-precedence\methods-loose-preset-not-loose\input.js environment variable to show the loaded configuration.
@@ -1,12 +1,14 @@
{
"BABEL_8_BREAKING": false,
"os": ["darwin", "linux"],
"validateLogs": true,
"presets": [
["env", {
"targets": { "node": 10 }
}]
[
"env",
{
"targets": { "node": 10 }
}
]
],
"plugins": [
["transform-private-methods", { "loose": true }]
]
"plugins": [["transform-private-methods", { "loose": true }]]
}
Expand Up @@ -2,7 +2,17 @@ Though the "loose" option was set to "false" in your @babel/preset-env config, i
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/methods-loose-preset-not-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-transform-class-properties since the "loose" mode option was set to "true" for @babel/plugin-transform-private-property-in-object.
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-class-properties", { "loose": true }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/methods-loose-preset-not-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
Expand Up @@ -2,3 +2,8 @@ Though the "loose" option was set to "false" in your @babel/preset-env config, i
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-and-methods-loose-preset-not-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
Expand Up @@ -2,3 +2,8 @@ Though the "loose" option was set to "true" in your @babel/preset-env config, it
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-property-in-object", { "loose": false }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-and-methods-not-loose-preset-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
@@ -0,0 +1,5 @@
class A {
x = 2;

#foo() {}
}
@@ -0,0 +1,15 @@
{
"BABEL_8_BREAKING": false,
"os": ["win32"],
"validateLogs": true,
"presets": [
[
"env",
{
"targets": { "node": 10 },
"shippedProposals": true
}
]
],
"plugins": [["proposal-class-properties", { "loose": true }]]
}
@@ -0,0 +1,17 @@
var id = 0;

function _classPrivateFieldLooseKey(name) { return "__private_" + id++ + "_" + name; }

var _foo = _classPrivateFieldLooseKey("foo");

class A {
constructor() {
Object.defineProperty(this, _foo, {
value: _foo2
});
this.x = 2;
}

}

var _foo2 = function _foo2() {};
@@ -0,0 +1,5 @@
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "true" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR=<CWD>\packages\babel-preset-env\test\fixtures\loose-class-features-precedence\properties-loose-preset-not-loose\input.js environment variable to show the loaded configuration.
@@ -1,12 +1,14 @@
{
"BABEL_8_BREAKING": false,
"os": ["darwin", "linux"],
"validateLogs": true,
"presets": [
["env", {
"targets": { "node": 10 }
}]
[
"env",
{
"targets": { "node": 10 }
}
]
],
"plugins": [
["transform-class-properties", { "loose": true }]
]
"plugins": [["transform-class-properties", { "loose": true }]]
}
Expand Up @@ -2,7 +2,17 @@ Though the "loose" option was set to "false" in your @babel/preset-env config, i
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-loose-preset-not-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-transform-private-methods since the "loose" mode option was set to "true" for @babel/plugin-transform-private-property-in-object.
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-loose-preset-not-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
@@ -0,0 +1,5 @@
class A {
x = 2;

#foo() {}
}
@@ -0,0 +1,16 @@
{
"BABEL_8_BREAKING": false,
"os": ["win32"],
"validateLogs": true,
"presets": [
[
"env",
{
"targets": { "node": 10 },
"shippedProposals": true,
"loose": true
}
]
],
"plugins": [["proposal-class-properties", { "loose": false }]]
}
@@ -0,0 +1,14 @@
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var _foo = new WeakSet();

class A {
constructor() {
_foo.add(this);

_defineProperty(this, "x", 2);
}

}

var _foo2 = function _foo2() {};
@@ -0,0 +1,5 @@
Though the "loose" option was set to "true" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "false" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-proposal-private-methods", { "loose": false }]
to the "plugins" section of your Babel config.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR=<CWD>\packages\babel-preset-env\test\fixtures\loose-class-features-precedence\properties-not-loose-preset-loose\input.js environment variable to show the loaded configuration.
@@ -1,13 +1,15 @@
{
"BABEL_8_BREAKING": false,
"os": ["darwin", "linux"],
"validateLogs": true,
"presets": [
["env", {
"targets": { "node": 10 },
"loose": true
}]
[
"env",
{
"targets": { "node": 10 },
"loose": true
}
]
],
"plugins": [
["transform-class-properties", { "loose": false }]
]
"plugins": [["transform-class-properties", { "loose": false }]]
}
Expand Up @@ -2,7 +2,17 @@ Though the "loose" option was set to "true" in your @babel/preset-env config, it
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-property-in-object", { "loose": false }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-not-loose-preset-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.
Though the "loose" option was set to "true" in your @babel/preset-env config, it will not be used for @babel/plugin-transform-private-methods since the "loose" mode option was set to "false" for @babel/plugin-transform-private-property-in-object.
The "loose" option must be the same for @babel/plugin-transform-class-properties, @babel/plugin-transform-private-methods and @babel/plugin-transform-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
["@babel/plugin-transform-private-methods", { "loose": false }]
to the "plugins" section of your Babel config.

If you already set the same 'loose' mode for these plugins in your config, it's possible that they are enabled multiple times with different options.
You can re-run Babel with the BABEL_SHOW_CONFIG_FOR environment variable to show the loaded configuration:
npx cross-env BABEL_SHOW_CONFIG_FOR=<CWD>/packages/babel-preset-env/test/fixtures/loose-class-features-precedence/properties-not-loose-preset-loose/input.js ...your build command...
See https://babeljs.io/docs/configuration#print-effective-configs for more info.

0 comments on commit 36fe828

Please sign in to comment.