Using Prettier as beautifier user's code in Angular project

In my project Prettier is already connected for the project code formatting. I'm trying to use Prettier for user's code formatting in Ace Editor:
import * as prettier from 'prettier';
import * as babel from 'prettier/plugins/babel';
import * as estree from 'prettier/plugins/estree';
...
const code = this.editor.getValue();
const formatted = prettier.format(code, {
parser: 'babel',
plugins: [babel, estree]
});
...but I get an error:
Uncaught TypeError: Super constructor null of anonymous class is not a constructor
I've tried different options - nothing has helped yet. Maybe someone has a successful experience - I would be very grateful.
Answer
Could you try changing the imports without the * as
and just use the default import.
import * as prettier from 'prettier';
import babel from 'prettier/plugins/babel'; // <- changed here!
import estree from 'prettier/plugins/estree'; // <- changed here!
...
const code = this.editor.getValue();
const formatted = prettier.format(code, {
parser: 'babel',
plugins: [babel, estree]
});
Enjoyed this question?
Check out more content on our blog or follow us on social media.
Browse more questions