Issue
I'm trying to utilize prettier
in StackBlitz to format HTML in Angular, but I encounter the following error:
Error: Couldn't resolve parser "angular". Parsers must be explicitly added to the standalone bundle.
I'm uncertain about what's missing. Any assistance would be appreciated.
The code I'm using is as follows:
import prettier from 'prettier';
import parserAngular from 'prettier/parser-angular';
console.clear();
console.log({ parserAngular }); // Checking existence.
const html = `
<span *ngIf="true">
do {{ some | json: ja }} bla
</span>
`;
const output = prettier.format(html, {
plugins: [parserAngular],
parser: 'angular',
singleQuote: true,
arrowParens: 'always',
semi: true,
bracketSameLine: true,
trailingComma: 'es5',
printWidth: 140,
});
console.log(output);
Solution
You should include parser-html
in the plugins array:
// Import stylesheets
import './style.css';
import prettier from 'prettier';
import parserAngular from 'prettier/parser-angular';
import parserHtml from 'prettier/parser-html';
console.clear();
console.log({ parserAngular });
// Write TypeScript code!
const appDiv: HTMLElement = document.getElementById('app');
appDiv.innerHTML = `<h1>TypeScript Starter</h1>`;
const html = `
<span *ngIf="true">
do {{ some | json: ja }} bla
</span>
`;
const output = prettier.format(html, {
plugins: [parserAngular, parserHtml],
parser: 'angular',
singleQuote: true,
arrowParens: 'always',
semi: true,
bracketSameLine: true,
trailingComma: 'es5',
printWidth: 140,
});
console.log(output);
Answered By - Shlomi Levi
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.