IntelliJ IDEA: Syntax Highlighting for Angular Pug templates like WebStorm

Hello,

Is it possible to provide code example and idea.log ("Help | Show Log in...") after restarting from both IDEs?

Hello,

Excuse me for too large content.

Note: I never open one project in two IDEs at the same time. I first, close it in one IDE and then open it in another.

reg-table.component.pug:

.wrapper
  .container.mat-elevation-z8
    table(mat-table, [dataSource]="dataSource")

      ng-container(matColumnDef="position")
        th(mat-header-cell, *matHeaderCellDef, i18n="@@posInTable") No.
        td(mat-cell, *matCellDef="let element") {{element.position | i18nNum}}
        td(mat-footer-cell, *matFooterCellDef) #

      ng-container(matColumnDef="name")
        th(mat-header-cell, *matHeaderCellDef, i18n="@@Name") Name
        td(mat-cell, *matCellDef="let element") {{element.name}}
        td(mat-footer-cell, *matFooterCellDef, i18n="@@Total") Total

      ng-container(matColumnDef="description")
        th(mat-header-cell, *matHeaderCellDef, i18n="@@Description") Description
        td(mat-cell, *matCellDef="let element") {{element.description}}
        td(mat-footer-cell, *matFooterCellDef)

      ng-container(matColumnDef="quantity")
        th(mat-header-cell, *matHeaderCellDef, i18n="@@Quantity") Quantity
        td(mat-cell, *matCellDef="let element") {{element.quantity}}
        td(mat-footer-cell, *matFooterCellDef)

      ng-container(matColumnDef="price")
        th(mat-header-cell, *matHeaderCellDef, i18n="@@Price") Price
        td(mat-cell, *matCellDef="let element") {{element.price}}
        td(mat-footer-cell, *matFooterCellDef)

      tr(mat-header-row, *matHeaderRowDef="displayedColumns; sticky: true")
      tr(mat-row, *matRowDef="let row; columns: displayedColumns;")
      tr(mat-footer-row, *matFooterRowDef="displayedColumns; sticky: true")

reg-table.component.ts:

import {Component} from '@angular/core';

@Component({
  selector: 'app-reg-table',
  templateUrl: './reg-table.component.pug',
  styleUrls: ['./reg-table.component.scss'],
})
export class RegTableComponent {
  displayedColumns = ['position', 'name', 'description', 'quantity', 'price'];
  dataSource = ELEMENT_DATA;
}

export interface PeriodicElement {
  position: number;
  name: string;
  description: string;
  quantity: number;
  price: string;
}

const ELEMENT_DATA: PeriodicElement[] = [
  {position: 1,  name: 'Hydr', description: 'Hydrogen',     quantity: 1.0079,   price: 'H' },
  {position: 2,  name: 'Heli', description: 'Helium',    quantity: 4.0026,   price: 'He'},
  {position: 3,  name: 'Lith', description: 'Lithium',   quantity: 6.941,    price: 'Li'},
  {position: 4,  name: 'Bery', description: 'Beryllium',  quantity: 9.0122,   price: 'Be'},
  {position: 5,  name: 'Boro', description: 'Boron',     quantity: 10.811,   price: 'B' },
  {position: 6,  name: 'Carb', description: 'Carbon',    quantity: 12.0107,  price: 'C' },
  {position: 7,  name: 'Nitr', description: 'Nitrogen',     quantity: 14.0067,  price: 'N' },
  {position: 8,  name: 'Oxyg', description: 'Oxygen',    quantity: 15.9994,  price: 'O' },
];

...\.IntelliJIdea\system\log\idea.log:

[cut for readability]

works fine for me in IU-183.5912.2, even with (most of) your custom plugins installed:

what editor color  scheme do you use? please provide your settings (File > Export Settings)

Thanks. You showed me the question is incorrect and the issue is not related to IDE itself but is related to its configurations, settings or customizations. After a lot of trials and errors, I found the source of the issue:

This is in:

Actions (Ctrl+Shift+A) -> Registry...

I had made editor.injected.highlighting.enabled unchecked for other purposes and that had caused this problem.

I see, thanks for clearing it up:)