Javascript ES6 TypeError: Class constructor Client cannot be invoked without 'new'
Javascriptnode.jsEcmascript 6Javascript Problem Overview
I have a class written in Javascript ES6. When I try to execute nodemon
command I always see this error TypeError: Class constructor Client cannot be invoked without 'new'
The full error is mentioned below:
/Users/akshaysood/Blockchain/fabricSDK/dist/application/Transaction.js:45
return (0, _possibleConstructorReturn3.default)(this, (FBClient.__proto__ || (0, _getPrototypeOf2.default)(FBClient)).call(this, props));
^
TypeError: Class constructor Client cannot be invoked without 'new'
at new FBClient (/Users/akshaysood/Blockchain/fabricSDK/dist/application/Transaction.js:45:127)
at Object.<anonymous> (/Users/akshaysood/Blockchain/fabricSDK/dist/application/Transaction.js:195:14)
at Module._compile (module.js:641:30)
at Object.Module._extensions..js (module.js:652:10)
at Module.load (module.js:560:32)
at tryModuleLoad (module.js:503:12)
at Function.Module._load (module.js:495:3)
at Module.require (module.js:585:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/Users/akshaysood/Blockchain/fabricSDK/dist/routes/users.js:11:20)
What I am trying to do is, I have created a class and then created an instance of that class. Then I am trying to export that variable.
The class structure is defined below:
class FBClient extends FabricClient{
constructor(props){
super(props);
}
<<< FUNCTIONS >>>
}
How I am trying to export the variable ->
var client = new FBClient();
client.loadFromConfig(config);
export default client = client;
You can find the full code here > https://hastebin.com/kecacenita.js Code generated by Babel > https://hastebin.com/fabewecumo.js
Javascript Solutions
Solution 1 - Javascript
The problem is that the class extends native ES6 class and is transpiled to ES5 with Babel. Transpiled classes cannot extend native classes, at least without additional measures.
class TranspiledFoo extends NativeBar {
constructor() {
super();
}
}
results in something like
function TranspiledFoo() {
var _this = NativeBar.call(this) || this;
return _this;
}
// prototypically inherit from NativeBar
Since ES6 classes should be only called with new
, NativeBar.call
results in error.
ES6 classes are supported in any recent Node version, they shouldn't be transpiled. es2015
should be excluded from Babel configuration, it's preferable to use env
preset set to node
target.
The same problem applies to TypeScript. The compiler should be properly configured to not transpile classes in order for them to inherit from native or Babel classes.
Solution 2 - Javascript
I was transpiling not Javascript but Typescript, and ran into the same problem.
I edited the Typescript compiler config file, tsconfig.json
, to generate ES2017 Javascript code:
{
"compilerOptions": {
"target": "ES2017",
instead of whatever the default is, ES2015? — then all worked fine.
(Maybe this answer can be helpful for people who use Typescript and find this question when they search for the same error message, like I did.)
Solution 3 - Javascript
For those who are using ts-node, it could be possible that your tsconfig.json
is unable to be loaded by ts-node.
- Make sure you've set the below option for
tsconfig.json
:
{
"compilerOptions": {
"target": "ES6",
...
}
}
- Try
ts-node --script-mode
or use--project
to specify the path of yourtsconfig.json
.
Solution 4 - Javascript
In package.json
you can use targets configuration with @babel/preset-env
.
set the esmodules
as 'true'.
Below is the example how I am using in my file:
"babel": {
"presets": [
[
"@babel/preset-env",
{
"targets": {
"esmodules": true
}
}
],
"@babel/preset-react",
"@babel/preset-flow"
],
"plugins": [
"@babel/plugin-proposal-class-properties"
]
},
Solution 5 - Javascript
For Angular 9+ this can be probably a matter of using typescript compilation flags also:
downlevelIteration
importHelpers
More info hereL https://www.typescriptlang.org/tsconfig#downlevelIteration.
Try to use this flags in your tsconfig.josn
:
{
"compilerOptions": {
...
"downlevelIteration": true,
"importHelpers": true,
...
}
}
Without "importHelpers": true
it should also works.
> This solution is mostly for Angular 9+ and ngcc compiler - this was an issue that occur for Angular 11. A custom configuration (custom ng-packgr config - Angular CLI library generating was introduced in Angular 6) for packages was maintained since there was Angular 4+ in the project. After miagration these packages to Angular 9+ libraries (projects folder) the error started occuring. I found that these flags (sctrictly downlevelIteration) solve exactly the problem.
Solution 6 - Javascript
If you are not using babel and simple typescript. I got the error in material. Try to reduce the versions and bring them down to similar versions. My packages were having variety of versions.I solved the issue by lowering the package versions of packages like cdk, material.
Solution 7 - Javascript
In my case it was observer from "mobx-react-lite".
Solution 8 - Javascript
The solution is to downgrade the package version.
npm uninstall connect-mongo
npm i connect-mongo@3
Solution 9 - Javascript
I hope you have already been able to solve your problem, here is my solution for this error:
> Blockquote
class indexRoutes
{
public router: Router= Router();
}
const INDEX_ROUTES = new indexRoutes();
export default INDEX_ROUTES.router;