ESLint unexpected token in calculated object key - eslint

Using the latest rules from eslint-config-react-app we get the following linting error:
{
[componentWidth > VIEW_DESKTOP && componentWidth <= VIEW_LARGE]: MAX_TICKS_LARGE
}
error Parsing error: Unexpected token
The issue seems to be located at <= in the calculated key.
Does anyone know what's causing this to throw an error? The code should be legit.
Update: interestingly, the linting error doesn't show up in my IDE, only in the console.
Update 2: Seems to be an issue with eslint latest version rather than anything related to eslint-config-react-app. Using the eslint version specified by eslint-config-react-app works fine, just not with the latest version of eslint.
Update 3
To provide a better context for the problem, here's the function within which this code exists:
const getTicksToDisplay = (componentWidth) => {
const truthMap = {
[true]: MIN_TICKS_ON_SCREEN,
[componentWidth > VIEW_LARGE]: MAX_TICKS_XLARGE,
[componentWidth > VIEW_DESKTOP && componentWidth <= VIEW_LARGE]: MAX_TICKS_LARGE,
[componentWidth > VIEW_TABLET && componentWidth <= VIEW_DESKTOP]: MAX_TICKS_DESKTOP,
[componentWidth > VIEW_MOBILE && componentWidth <= VIEW_TABLET]: MAX_TICKS_TABLET,
[componentWidth <= VIEW_MOBILE]: MAX_TICKS_MOBILE
};
return truthMap[true];
};
Update 4
The version of eslint at the time of asking this question was 3.11.1. The code works in eslint 3.8.1 and since asking this question, eslint 3.12.0 has been released (which I haven't been able to test against yet)
Update 5
Upon further testing it looks like this might be an issue with babel-eslint 7.1.1. I've raised an issue: https://github.com/babel/babel-eslint/issues/428

Related

React UnhandledSchemeError - "node:buffer" is not handled by plugins

I'm trying to use a package in my React project that will allow me to make API calls (axios, node-fetch, got etc.)
When these packages are not installed, the app runs properly. When any of them are installed and called in the code, I'm facing the error as follows:
Ignoring the warnings, I believe the problem has its roots from the output below:
Failed to compile.
Module build failed: UnhandledSchemeError: Reading from "node:buffer" is not handled by plugins (Unhandled scheme).
Webpack supports "data:" and "file:" URIs by default.
You may need an additional plugin to handle "node:" URIs.
I tried everything. Reinstalled node_modules. Created a clean test app, tried there. Also did my research, didn't find any relevant, clear solution on this. Nothing helped.
What am I doing wrong??
DomException file content:
/*! node-domexception. MIT License. Jimmy Wärting <https://jimmy.warting.se/opensource> */
if (!globalThis.DOMException) {
try {
const { MessageChannel } = require('worker_threads'),
port = new MessageChannel().port1,
ab = new ArrayBuffer()
port.postMessage(ab, [ab, ab])
} catch (err) {
err.constructor.name === 'DOMException' && (
globalThis.DOMException = err.constructor
)
}
}
module.exports = globalThis.DOMException
npm version: 8.5.5
node version: 16.15.0
You can work around this with this Webpack configuration:
plugins: [
new webpack.NormalModuleReplacementPlugin(/node:/, (resource) => {
resource.request = resource.request.replace(/^node:/, "");
}),
]

Module not found: Can't resolve 'worker_threads for Node Version 12

I am trying to upgrade a library which uses worker_threads. I am getting a warning in local while building, but on CI, as process.env.CI=true, npm build fails with the following error message:
Treating warnings as errors because process.env.CI = true.
Most CI servers set it automatically.
Failed to compile.
./node_modules/<lib>/<lib_name>.js
Module not found: Can't resolve 'worker_threads' in '/sys_apps_01/jenkins/workspace/./node_modules/<lib>/<lib_name>.js'
Looking at doc, worker_threads was introduced in Node v12+. My local and CI are both Node v12+, but am still getting Module not found: Can't resolve 'worker_threads' error.
Looking at webpack (ejected from CRA), this is the root cause of exception,
build.js of Webpack:
if (process.env.CI &&
(typeof process.env.CI !== 'string' ||
process.env.CI.toLowerCase() !== 'false') &&
messages.warnings.length) {
console.log(
chalk.yellow(
'\nTreating warnings as errors because process.env.CI = true.\n' +
'Most CI servers set it automatically.\n'
)
)
return reject(new Error(messages.warnings.join('\n\n')))
}
I think I can comment return reject(new Error(messages.warnings.join('\n\n'))) but this seems to be hack. Is there a solution by which CI works without worker_threads throwing a warning?
CI Node Version: 12

Cannot run Angular-cli at node 10.16.0

Here is my computer information:
node version 10.16.0
npm version 6.9.0
Environment Variables C:\Users\tran.sonhoang\AppData\Roaming\npm\node_modules\#angular\cli\bin
My problem is when I run ng new app-name I will get the file with this info
#!/usr/bin/env node
'use strict';
// Provide a title to the process in `ps`.
// Due to an obscure Mac bug, do not start this title with any symbol.
try {
process.title = 'ng ' + Array.from(process.argv).slice(2).join(' ');
} catch(_) {
// If an error happened above, use the most basic title.
process.title = 'ng';
}
// Some older versions of Node do not support let or const.
var version = process.version.substr(1).split('.');
if (Number(version[0]) < 10 || (Number(version[0]) === 10 && Number(version[1]) < 9)) {
process.stderr.write(
'You are running version ' + process.version + ' of Node.js, which is not supported by Angular CLI 8.0+.\n' +
'The official Node.js version that is supported is 10.9 or greater.\n\n' +
'Please visit https://nodejs.org/en/ to find instructions on how to update Node.js.\n'
);
process.exit(3);
}
require('../lib/init');
This issue is so strange to me since this is the first time I see this issue with angular-cli.
What I have tried:
Removed node and install again the same version.
Remove npm cache + update npm
Remove Angular-cli and re-install
But It still not fix this issue. Any help will be appreciated.Thanks!

ng v is working in cmd but not working in vs code

SO i wanted to create an web application so i downloaded VS code and node.js the current version and i installed everything successfully.
When i type ng v in cmd i am able to view the version of angular but when i open a folder and run the same command in vs code i get an error code like this
#!/usr/bin/env node
'use strict';
// Provide a title to the process in `ps`.
// Due to an obscure Mac bug, do not start this title with any symbol.
try {
process.title = 'ng ' + Array.from(process.argv).slice(2).join(' ');
} catch(_) {
// If an error happened above, use the most basic title.
process.title = 'ng';
}
// Some older versions of Node do not support let or const.
var version = process.version.substr(1).split('.');
if (Number(version[0]) < 8 || (Number(version[0]) === 8 &&
Number(version[1]) < 9)) {
process.stderr.write(
'You are running version ' + process.version + ' of Node.js, which is not supported by Angular CLI v6.\n' +
'The official Node.js version that is supported is 8.9 and greater.\n\n' +
'Please visit https://nodejs.org/en/ to find instructions on how to update Node.js.\n'
);
process.exit(3);
}
require('../lib/init');
i know this says node version is < 8 but my node version is 12.1.0 which is clearly greater than version 8. I even tried to uninstall it and reinstall it but still i am getting this error. PLEASE HELP MEE

Getting error while using Imagemagick npm

I am using Imagemagick npm in node to compress an image. I installed the npm module and it was working fine. But after some time, it throws the error shown below.
TypeError: currentLine.search is not a function
If I install the module again, it doesn't show the error. But again after some time, it throws the same error. I am using 0.1.3 version of Imagemagick with 8.9.1 version of node.
Can any one help me with this issue?
Even I got the same issue for 0.1.3 npm version. After some debugging, I found that if we add custom functions into Array.prototype like this
Array.prototype.asyncforEach = async function(cbk) {
for (let i = 0; i < this.length; i++) await cbk(this[i], i, this);
};
Which will leads to an error in file node_modules/imagemagick/imagemagick.js at line number 113 i will have asyncforEach as a value so we have to change our Array.prototype.methodName like below or reference this for better understanding.
Object.defineProperty(Array.prototype, 'asyncforEach', {
value: async function(cbk) {
for (let i = 0; i < this.length; i++) await cbk(this[i], i, this);
}
});

Resources