fix(pipe-parser): add support for more sophisticated expressions that worked in version 4.2.0 with the regex based parser (#185)

* fix(pipe-parser): add support for more sophisticated expressions

.github/FUNDING.yml

@@ -1,2 +1,2 @@
-github: #biesbjerg
+github: biesbjerg
 custom: https://donate.biesbjerg.com

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

README.md

@@ -15,7 +15,8 @@ Add a script to your project's `package.json`:
 ```json
 ...
 "scripts": {
-  "extract-i18n": "ngx-translate-extract --input ./src --output ./src/assets/i18n/ --clean --sort --format namespaced-json"
+  "i18n:init": "ngx-translate-extract --input ./src --output ./src/assets/i18n/template.json --key-as-default-value --replace --format json",
+  "i18n:extract": "ngx-translate-extract --input ./src --output ./src/assets/i18n/{en,da,de,fi,nb,nl,sv}.json --clean --format json"
 }
 ...
 ```
@@ -25,11 +26,11 @@ You can now run `npm run extract-i18n` and it will extract strings from your pro
 
 **Extract from dir and save to file**
 
-`ngx-translate-extract --input ./src --output ./src/assets/i18n/template.json`
+`ngx-translate-extract --input ./src --output ./src/assets/i18n/strings.json`
 
 **Extract from multiple dirs**
 
-`ngx-translate-extract --input ./src-a ./src-b --output ./src/assets/i18n/template.json`
+`ngx-translate-extract --input ./src-a ./src-b --output ./src/assets/i18n/strings.json`
 
 
 **Extract and save to multiple files using path expansion**
@@ -91,12 +92,16 @@ Options:
                  patterns and multiple paths                                                [array] [required]
 
 Examples:
-  cli.js -i ./src-a/ -i ./src-b/ -o strings.json           Extract (ts, html) from multiple paths
-  cli.js -i './{src-a,src-b}/' -o strings.json             Extract (ts, html) from multiple paths using brace
+  ngx-translate-extract -i ./src-a/ -i ./src-b/ -o strings.json           Extract (ts, html) from multiple paths
+  ngx-translate-extract -i './{src-a,src-b}/' -o strings.json             Extract (ts, html) from multiple paths using brace
                                                            expansion
-  cli.js -i ./src/ -o ./i18n/da.json -o ./i18n/en.json     Extract (ts, html) and save to da.json and en.json
-  cli.js -i ./src/ -o './i18n/{en,da}.json'                Extract (ts, html) and save to da.json and en.json
+  ngx-translate-extract -i ./src/ -o ./i18n/da.json -o ./i18n/en.json     Extract (ts, html) and save to da.json and en.json
+  ngx-translate-extract -i ./src/ -o './i18n/{en,da}.json'                Extract (ts, html) and save to da.json and en.json
                                                            using brace expansion
-  cli.js -i './src/**/*.{ts,tsx,html}' -o strings.json     Extract from ts, tsx and html
-  cli.js -i './src/**/!(*.spec).{ts,html}' -o              Extract from ts, html, excluding files with ".spec"
-  strings.json
+  ngx-translate-extract -i './src/**/*.{ts,tsx,html}' -o strings.json     Extract from ts, tsx and html
+  ngx-translate-extract -i './src/**/!(*.spec).{ts,html}' -o              Extract from ts, html, excluding files with ".spec"
+  strings.json
+
+## Note for GetText users
+
+Please pay attention of which version of `gettext-parser` you actually use in your project. For instance, `gettext-parser:1.2.2` does not support HTML tags in translation keys.

package-lock.json

@@ -1,13 +1,14 @@
 {
   "name": "@biesbjerg/ngx-translate-extract",
-  "version": "4.2.0",
+  "version": "6.0.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
     "@angular/compiler": {
-      "version": "9.0.7",
-      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-9.0.7.tgz",
-      "integrity": "sha512-hFpkuGpzxpK5h59LHHAjTFWsY6DCXZwgJFqvCuTPxWi/srvLGZRXrpC6Z1SlgHI9xxXaPfoa4uWw2VfA3BnqEg=="
+      "version": "9.1.1",
+      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-9.1.1.tgz",
+      "integrity": "sha512-u1IP6IzUgK6lIzrG1cxp96umXgtThyhuFn/KPoyVt7wPxZ6vVR0ZxjM7zycEcrMGzk0nf0nyOKaksJk9sTXTbg==",
+      "dev": true
     },
     "@babel/code-frame": {
       "version": "7.8.3",
@@ -136,6 +137,15 @@
       "integrity": "sha512-GcgAp7RXXGmA61spVEKZYpIy3/iV6GHbTW9f9kaKwHVQgnWitt6X026e+3N6j8ep1bkIWj83qPHQ3Y9Ft8FqiQ==",
       "dev": true
     },
+    "@types/gettext-parser": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@types/gettext-parser/-/gettext-parser-4.0.0.tgz",
+      "integrity": "sha512-I/wvhr+l5M7IwBF1ADBfNQ6qGfUg85UTjj/AZWn09Y+POqyLe1cfbdJSMWzCobiJ3EJNY23MQCbP6jxQT81OTQ==",
+      "dev": true,
+      "requires": {
+        "@types/node": "*"
+      }
+    },
     "@types/glob": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz",
@@ -169,9 +179,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "12.12.30",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.30.tgz",
-      "integrity": "sha512-sz9MF/zk6qVr3pAnM0BSQvYIBK44tS75QC5N+VbWSE4DjCV/pJ+UzCW/F+vVnl7TkOPcuwQureKNtSSwjBTaMg==",
+      "version": "12.12.31",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.31.tgz",
+      "integrity": "sha512-T+wnJno8uh27G9c+1T+a1/WYCHzLeDqtsGJkoEdSp2X8RTh3oOCZQcUnjAx90CS8cmmADX51O0FI/tu9s0yssg==",
       "dev": true
     },
     "@types/parse-json": {
@@ -1133,9 +1143,9 @@
       "dev": true
     },
     "lint-staged": {
-      "version": "10.0.8",
-      "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-10.0.8.tgz",
-      "integrity": "sha512-Oa9eS4DJqvQMVdywXfEor6F4vP+21fPHF8LUXgBbVWUSWBddjqsvO6Bv1LwMChmgQZZqwUvgJSHlu8HFHAPZmA==",
+      "version": "10.0.9",
+      "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-10.0.9.tgz",
+      "integrity": "sha512-NKJHYgRa8oI9c4Ic42ZtF2XA6Ps7lFbXwg3q0ZEP0r55Tw3YWykCW1RzW6vu+QIGqbsy7DxndvKu93Wtr5vPQw==",
       "dev": true,
       "requires": {
         "chalk": "^3.0.0",
@@ -1881,9 +1891,9 @@
       }
     },
     "prettier": {
-      "version": "1.19.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
-      "integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.0.2.tgz",
+      "integrity": "sha512-5xJQIPT8BraI7ZnaDwSbu5zLrB6vvi8hVV58yHQ+QK64qrY40dULy0HSRlQ2/2IdzeBpjhDkqdcFBnFeDEMVdg==",
       "dev": true
     },
     "process": {
@@ -1978,6 +1988,15 @@
         }
       }
     },
+    "rimraf": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "dev": true,
+      "requires": {
+        "glob": "^7.1.3"
+      }
+    },
     "rxjs": {
       "version": "6.5.4",
       "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.5.4.tgz",
@@ -2222,9 +2241,9 @@
       }
     },
     "ts-node": {
-      "version": "8.7.0",
-      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-8.7.0.tgz",
-      "integrity": "sha512-s659CsHrsxaRVDEleuOkGvbsA0rWHtszUNEt1r0CgAFN5ZZTQtDzpsluS7W5pOGJIa1xZE8R/zK4dEs+ldFezg==",
+      "version": "8.8.1",
+      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-8.8.1.tgz",
+      "integrity": "sha512-10DE9ONho06QORKAaCBpPiFCdW+tZJuY/84tyypGtl6r+/C7Asq0dhqbRZURuUlLQtZxxDvT8eoj8cGW0ha6Bg==",
       "dev": true,
       "requires": {
         "arg": "^4.1.0",
@@ -2428,7 +2447,8 @@
     "typescript": {
       "version": "3.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.8.3.tgz",
-      "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w=="
+      "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w==",
+      "dev": true
     },
     "util": {
       "version": "0.10.4",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@biesbjerg/ngx-translate-extract",
-  "version": "5.0.0",
+  "version": "6.0.4",
   "description": "Extract strings from projects using ngx-translate",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -14,7 +14,7 @@
   "scripts": {
     "build": "npm run clean && tsc",
     "watch": "npm run clean && tsc --watch",
-    "clean": "rm -rf ./dist",
+    "clean": "rimraf ./dist",
     "lint": "tslint --force './src/**/*.ts'",
     "test": "mocha -r ts-node/register tests/**/*.spec.ts"
   },
@@ -57,32 +57,39 @@
   },
   "homepage": "https://github.com/biesbjerg/ngx-translate-extract",
   "engines": {
-    "node": ">=12"
+    "node": ">=11.15.0"
   },
   "config": {},
   "devDependencies": {
+    "@angular/compiler": "^9.1.1",
     "@types/braces": "^3.0.0",
     "@types/chai": "^4.2.11",
     "@types/flat": "^5.0.0",
+    "@types/gettext-parser": "4.0.0",
     "@types/glob": "^7.1.1",
     "@types/mkdirp": "^1.0.0",
     "@types/mocha": "^7.0.2",
-    "@types/node": "^12.12.30",
+    "@types/node": "^12.12.31",
     "@types/yargs": "^15.0.4",
     "braces": "^3.0.2",
     "chai": "^4.2.0",
     "husky": "^4.2.3",
-    "lint-staged": "^10.0.8",
+    "lint-staged": "^10.0.9",
     "mocha": "^7.1.1",
-    "prettier": "^1.19.1",
-    "ts-node": "^8.7.0",
+    "prettier": "^2.0.2",
+    "rimraf": "^3.0.2",
+    "ts-node": "^8.8.1",
     "tslint": "^6.1.0",
     "tslint-config-prettier": "^1.18.0",
     "tslint-eslint-rules": "^5.4.0",
-    "tslint-etc": "^1.10.1"
+    "tslint-etc": "^1.10.1",
+    "typescript": "^3.8.3"
+  },
+  "peerDependencies": {
+    "@angular/compiler": "^8.0.0 || ^9.0.0",
+    "typescript": "^3.0.0"
   },
   "dependencies": {
-    "@angular/compiler": "^9.0.7",
     "@phenomnomnominal/tsquery": "^4.0.0",
     "boxen": "^4.2.0",
     "colorette": "^1.1.0",
@@ -92,7 +99,6 @@
     "mkdirp": "^1.0.3",
     "path": "^0.12.7",
     "terminal-link": "^2.1.1",
-    "typescript": "^3.8.3",
     "yargs": "^15.3.1"
   }
 }

src/cli/cli.ts

@@ -1,4 +1,5 @@
 import * as yargs from 'yargs';
+import { red, green } from 'colorette';
 
 import { ExtractTask } from './tasks/extract.task';
 import { ParserInterface } from '../parsers/parser.interface';
@@ -18,14 +19,13 @@ import { normalizePaths } from '../utils/fs-helpers';
 import { donateMessage } from '../utils/donate';
 
 // First parsing pass to be able to access pattern argument for use input/output arguments
-const y = yargs
-	.option('patterns', {
-		alias: 'p',
-		describe: 'Default patterns',
-		type: 'array',
-		default: ['/**/*.html', '/**/*.ts'],
-		hidden: true
-	});
+const y = yargs.option('patterns', {
+	alias: 'p',
+	describe: 'Default patterns',
+	type: 'array',
+	default: ['/**/*.html', '/**/*.ts'],
+	hidden: true
+});
 
 const parsed = y.parse();
 
@@ -149,6 +149,13 @@ const compiler: CompilerInterface = CompilerFactory.create(cli.format, {
 });
 extractTask.setCompiler(compiler);
 
-extractTask.execute();
-
-console.log(donateMessage);
+// Run task
+try {
+	extractTask.execute();
+	console.log(green('\nDone.\n'));
+	console.log(donateMessage);
+	process.exit(0);
+} catch (e) {
+	console.log(red(`\nAn error occurred: ${e}\n`));
+	process.exit(1);
+}

src/cli/tasks/extract.task.ts

@@ -4,7 +4,7 @@ import { ParserInterface } from '../../parsers/parser.interface';
 import { PostProcessorInterface } from '../../post-processors/post-processor.interface';
 import { CompilerInterface } from '../../compilers/compiler.interface';
 
-import { cyan, green, bold, dim } from 'colorette';
+import { cyan, green, bold, dim, red } from 'colorette';
 import * as glob from 'glob';
 import * as fs from 'fs';
 import * as path from 'path';
@@ -24,8 +24,8 @@ export class ExtractTask implements TaskInterface {
 	protected compiler: CompilerInterface;
 
 	public constructor(protected inputs: string[], protected outputs: string[], options?: ExtractTaskOptionsInterface) {
-		this.inputs = inputs.map(input => path.resolve(input));
-		this.outputs = outputs.map(output => path.resolve(output));
+		this.inputs = inputs.map((input) => path.resolve(input));
+		this.outputs = outputs.map((output) => path.resolve(output));
 		this.options = { ...this.options, ...options };
 	}
 
@@ -44,7 +44,7 @@ export class ExtractTask implements TaskInterface {
 
 		this.out(bold('Saving:'));
 
-		this.outputs.forEach(output => {
+		this.outputs.forEach((output) => {
 			let dir: string = output;
 			let filename: string = `strings.${this.compiler.extension}`;
 			if (!fs.existsSync(output) || !fs.statSync(output).isDirectory()) {
@@ -56,26 +56,33 @@ export class ExtractTask implements TaskInterface {
 
 			let existing: TranslationCollection = new TranslationCollection();
 			if (!this.options.replace && fs.existsSync(outputPath)) {
-				existing = this.compiler.parse(fs.readFileSync(outputPath, 'utf-8'));
+				try {
+					existing = this.compiler.parse(fs.readFileSync(outputPath, 'utf-8'));
+				} catch (e) {
+					this.out(`%s %s`, dim(`- ${outputPath}`), red(`[ERROR]`));
+					throw e;
+				}
 			}
 
 			// merge extracted strings with existing
 			const draft = extracted.union(existing);
 
-			if (existing.isEmpty()) {
-				this.out(dim(`- ${outputPath}`));
-			} else {
-				this.out(dim(`- ${outputPath} (merged)`));
-			}
-
 			// Run collection through post processors
 			const final = this.process(draft, extracted, existing);
 
-			// Save to file
-			this.save(outputPath, final);
+			// Save
+			try {
+				let event = 'CREATED';
+				if (fs.existsSync(outputPath)) {
+					this.options.replace ? event = 'REPLACED' : event = 'MERGED';
+				}
+				this.save(outputPath, final);
+				this.out(`%s %s`, dim(`- ${outputPath}`), green(`[${event}]`));
+			} catch (e) {
+				this.out(`%s %s`, dim(`- ${outputPath}`), red(`[ERROR]`));
+				throw e;
+			}
 		});
-
-		this.out(green('\nDone.\n'));
 	}
 
 	public setParsers(parsers: ParserInterface[]): this {
@@ -98,11 +105,11 @@ export class ExtractTask implements TaskInterface {
 	 */
 	protected extract(): TranslationCollection {
 		let collection: TranslationCollection = new TranslationCollection();
-		this.inputs.forEach(pattern => {
-			this.getFiles(pattern).forEach(filePath => {
+		this.inputs.forEach((pattern) => {
+			this.getFiles(pattern).forEach((filePath) => {
 				this.out(dim('- %s'), filePath);
 				const contents: string = fs.readFileSync(filePath, 'utf-8');
-				this.parsers.forEach(parser => {
+				this.parsers.forEach((parser) => {
 					const extracted = parser.extract(contents, filePath);
 					if (extracted instanceof TranslationCollection) {
 						collection = collection.union(extracted);
@@ -117,7 +124,7 @@ export class ExtractTask implements TaskInterface {
 	 * Run strings through configured post processors
 	 */
 	protected process(draft: TranslationCollection, extracted: TranslationCollection, existing: TranslationCollection): TranslationCollection {
-		this.postProcessors.forEach(postProcessor => {
+		this.postProcessors.forEach((postProcessor) => {
 			draft = postProcessor.process(draft, extracted, existing);
 		});
 		return draft;
@@ -139,9 +146,7 @@ export class ExtractTask implements TaskInterface {
 	 * Get all files matching pattern
 	 */
 	protected getFiles(pattern: string): string[] {
-		return glob
-			.sync(pattern)
-			.filter(filePath => fs.statSync(filePath).isFile());
+		return glob.sync(pattern).filter((filePath) => fs.statSync(filePath).isFile());
 	}
 
 	protected out(...args: any[]): void {
@@ -151,7 +156,7 @@ export class ExtractTask implements TaskInterface {
 	protected printEnabledParsers(): void {
 		this.out(cyan('Enabled parsers:'));
 		if (this.parsers.length) {
-			this.out(cyan(dim(this.parsers.map(parser => `- ${parser.constructor.name}`).join('\n'))));
+			this.out(cyan(dim(this.parsers.map((parser) => `- ${parser.constructor.name}`).join('\n'))));
 		} else {
 			this.out(cyan(dim('(none)')));
 		}
@@ -161,7 +166,7 @@ export class ExtractTask implements TaskInterface {
 	protected printEnabledPostProcessors(): void {
 		this.out(cyan('Enabled post processors:'));
 		if (this.postProcessors.length) {
-			this.out(cyan(dim(this.postProcessors.map(postProcessor => `- ${postProcessor.constructor.name}`).join('\n'))));
+			this.out(cyan(dim(this.postProcessors.map((postProcessor) => `- ${postProcessor.constructor.name}`).join('\n'))));
 		} else {
 			this.out(cyan(dim('(none)')));
 		}

src/compilers/json.compiler.ts

@@ -28,6 +28,6 @@ export class JsonCompiler implements CompilerInterface {
 	}
 
 	protected isNamespacedJsonFormat(values: any): boolean {
-		return Object.keys(values).some(key => typeof values[key] === 'object');
+		return Object.keys(values).some((key) => typeof values[key] === 'object');
 	}
 }

src/compilers/po.compiler.ts

@@ -1,7 +1,7 @@
 import { CompilerInterface } from './compiler.interface';
 import { TranslationCollection, TranslationType } from '../utils/translation.collection';
 
-import * as gettext from 'gettext-parser';
+import { po } from 'gettext-parser';
 
 export class PoCompiler implements CompilerInterface {
 	public extension: string = 'po';
@@ -22,43 +22,38 @@ export class PoCompiler implements CompilerInterface {
 				'content-transfer-encoding': '8bit'
 			},
 			translations: {
-				[this.domain]: Object.keys(collection.values).reduce(
-					(translations, key) => {
-						return {
-							...translations,
-							[key]: {
-								msgid: key,
-								msgstr: collection.get(key)
-							}
-						};
-					},
-					{} as any
-				)
+				[this.domain]: Object.keys(collection.values).reduce((translations, key) => {
+					return {
+						...translations,
+						[key]: {
+							msgid: key,
+							msgstr: collection.get(key)
+						}
+					};
+				}, {} as any)
 			}
 		};
 
-		return gettext.po.compile(data);
+		return po.compile(data).toString('utf8');
 	}
 
 	public parse(contents: string): TranslationCollection {
 		const collection = new TranslationCollection();
 
-		const po = gettext.po.parse(contents, 'utf8');
-		if (!po.translations.hasOwnProperty(this.domain)) {
+		const parsedPo = po.parse(contents, 'utf8');
+
+		if (!parsedPo.translations.hasOwnProperty(this.domain)) {
 			return collection;
 		}
 
-		const values = Object.keys(po.translations[this.domain])
-			.filter(key => key.length > 0)
-			.reduce(
-				(result, key) => {
-					return {
-						...result,
-						[key]: po.translations[this.domain][key].msgstr.pop()
-					};
-				},
-				{} as TranslationType
-			);
+		const values = Object.keys(parsedPo.translations[this.domain])
+			.filter((key) => key.length > 0)
+			.reduce((result, key) => {
+				return {
+					...result,
+					[key]: parsedPo.translations[this.domain][key].msgstr.pop()
+				};
+			}, {} as TranslationType);
 
 		return new TranslationCollection(values);
 	}

src/declarations.d.ts

@@ -1 +0,0 @@
-declare module 'gettext-parser';

src/parsers/directive.parser.ts

@@ -13,8 +13,8 @@ export class DirectiveParser implements ParserInterface {
 		let collection: TranslationCollection = new TranslationCollection();
 
 		const nodes: TmplAstNode[] = this.parseTemplate(source, filePath);
-		this.getTranslatableElements(nodes).forEach(element => {
-			const key = this.getElementTranslateAttrValue(element) || this.getElementContents(element);
+		this.getTranslatableElements(nodes).forEach((element) => {
+			const key = this.getElementTranslateAttrValue(element) || this.getElementContent(element);
 			collection = collection.add(key);
 		});
 
@@ -23,11 +23,11 @@ export class DirectiveParser implements ParserInterface {
 
 	protected getTranslatableElements(nodes: TmplAstNode[]): TmplAstElement[] {
 		return nodes
-			.filter(element => this.isElement(element))
+			.filter((element) => this.isElement(element))
 			.reduce((result: TmplAstElement[], element: TmplAstElement) => {
 				return result.concat(this.findChildrenElements(element));
 			}, [])
-			.filter(element => this.isTranslatable(element));
+			.filter((element) => this.isTranslatable(element));
 	}
 
 	protected findChildrenElements(node: TmplAstNode): TmplAstElement[] {
@@ -35,7 +35,7 @@ export class DirectiveParser implements ParserInterface {
 			return [];
 		}
 
-		// If element has translate attribute all its contents is translatable
+		// If element has translate attribute all its content is translatable
 		// so we don't need to traverse any deeper
 		if (this.isTranslatable(node)) {
 			return [node];
@@ -62,21 +62,26 @@ export class DirectiveParser implements ParserInterface {
 	}
 
 	protected isTranslatable(node: TmplAstNode): boolean {
-		if (this.isElement(node) && node.attributes.some(attribute => attribute.name === 'translate')) {
+		if (this.isElement(node) && node.attributes.some((attribute) => attribute.name === 'translate')) {
 			return true;
 		}
 		return false;
 	}
 
 	protected getElementTranslateAttrValue(element: TmplAstElement): string {
-		const attr: TmplAstTextAttribute = element.attributes.find(attribute => attribute.name === 'translate');
+		const attr: TmplAstTextAttribute = element.attributes.find((attribute) => attribute.name === 'translate');
 		return attr?.value ?? '';
 	}
 
-	protected getElementContents(element: TmplAstElement): string {
-		const contents = element.sourceSpan.start.file.content;
+	protected getElementContent(element: TmplAstElement): string {
+		const content = element.sourceSpan.start.file.content;
 		const start = element.startSourceSpan.end.offset;
 		const end = element.endSourceSpan.start.offset;
-		return contents.substring(start, end).trim();
+		const val = content.substring(start, end);
+		return this.cleanKey(val);
+	}
+
+	protected cleanKey(val: string): string {
+		return val.replace(/\r?\n|\r|\t/g, '').trim();
 	}
 }

src/parsers/marker.parser.ts

@@ -19,7 +19,7 @@ export class MarkerParser implements ParserInterface {
 		let collection: TranslationCollection = new TranslationCollection();
 
 		const callExpressions = findFunctionCallExpressions(sourceFile, markerImportName);
-		callExpressions.forEach(callExpression => {
+		callExpressions.forEach((callExpression) => {
 			const [firstArg] = callExpression.arguments;
 			if (!firstArg) {
 				return;

src/parsers/pipe.parser.ts

@@ -1,4 +1,16 @@
-import { TmplAstNode, parseTemplate, BindingPipe, LiteralPrimitive, Conditional, TmplAstTextAttribute } from '@angular/compiler';
+import {
+	AST,
+	TmplAstNode,
+	parseTemplate,
+	BindingPipe,
+	LiteralPrimitive,
+	Conditional,
+	TmplAstTextAttribute,
+	Binary,
+	LiteralMap,
+	LiteralArray,
+	Interpolation
+} from '@angular/compiler';
 
 import { ParserInterface } from './parser.interface';
 import { TranslationCollection } from '../utils/translation.collection';
@@ -14,8 +26,8 @@ export class PipeParser implements ParserInterface {
 
 		let collection: TranslationCollection = new TranslationCollection();
 		const nodes: TmplAstNode[] = this.parseTemplate(source, filePath);
-		const pipes: BindingPipe[] = nodes.map(node => this.findPipesInNode(node)).flat();
-		pipes.forEach(pipe => {
+		const pipes: BindingPipe[] = nodes.map((node) => this.findPipesInNode(node)).flat();
+		pipes.forEach((pipe) => {
 			this.parseTranslationKeysFromPipe(pipe).forEach((key: string) => {
 				collection = collection.add(key);
 			});
@@ -36,9 +48,8 @@ export class PipeParser implements ParserInterface {
 			);
 		}
 
-		if (node?.value?.ast?.expressions) {
-			const translateables = node.value.ast.expressions.filter((exp: any) => this.expressionIsOrHasBindingPipe(exp));
-			ret.push(...translateables);
+		if (node?.value?.ast) {
+			ret.push(...this.getTranslatablesFromAst(node.value.ast));
 		}
 
 		if (node?.attributes) {
@@ -51,17 +62,8 @@ export class PipeParser implements ParserInterface {
 		if (node?.inputs) {
 			node.inputs.forEach((input: any) => {
 				// <element [attrib]="'identifier' | translate">
-				if (input?.value?.ast && this.expressionIsOrHasBindingPipe(input.value.ast)) {
-					ret.push(input.value.ast);
-				}
-
-				// <element attrib="{{'identifier' | translate}}>"
-				if (input?.value?.ast?.expressions) {
-					input.value.ast.expressions.forEach((exp: BindingPipe) => {
-						if (this.expressionIsOrHasBindingPipe(exp)) {
-							ret.push(exp);
-						}
-					});
+				if (input?.value?.ast) {
+					ret.push(...this.getTranslatablesFromAst(input.value.ast));
 				}
 			});
 		}
@@ -84,7 +86,63 @@ export class PipeParser implements ParserInterface {
 		return ret;
 	}
 
-	protected expressionIsOrHasBindingPipe(exp: any): boolean {
+	protected getTranslatablesFromAst(ast: AST): BindingPipe[] {
+		// the entire expression is the translate pipe, e.g.:
+		// - 'foo' | translate
+		// - (condition ? 'foo' : 'bar') | translate
+		if (this.expressionIsOrHasBindingPipe(ast)) {
+			return [ast];
+		}
+
+		// angular double curly bracket interpolation, e.g.:
+		// - {{ expressions }}
+		if (ast instanceof Interpolation) {
+			return this.getTranslatablesFromAsts(ast.expressions);
+		}
+
+		// ternary operator, e.g.:
+		// - condition ? null : ('foo' | translate)
+		// - condition ? ('foo' | translate) : null
+		if (ast instanceof Conditional) {
+			return this.getTranslatablesFromAsts([ast.trueExp, ast.falseExp]);
+		}
+
+		// string concatenation, e.g.:
+		// - 'foo' + 'bar' + ('baz' | translate)
+		if (ast instanceof Binary) {
+			return this.getTranslatablesFromAsts([ast.left, ast.right]);
+		}
+
+		// a pipe on the outer expression, but not the translate pipe - ignore the pipe, visit the expression, e.g.:
+		// - { foo: 'Hello' | translate } | json
+		if (ast instanceof BindingPipe) {
+			return this.getTranslatablesFromAst(ast.exp);
+		}
+
+		// object - ignore the keys, visit all values, e.g.:
+		// - { key1: 'value1' | translate, key2: 'value2' | translate }
+		if (ast instanceof LiteralMap) {
+			return this.getTranslatablesFromAsts(ast.values);
+		}
+
+		// array - visit all its values, e.g.:
+		// - [ 'value1' | translate, 'value2' | translate ]
+		if (ast instanceof LiteralArray) {
+			return this.getTranslatablesFromAsts(ast.expressions);
+		}
+
+		return [];
+	}
+
+	protected getTranslatablesFromAsts(asts: AST[]): BindingPipe[] {
+		return this.flatten(asts.map(ast => this.getTranslatablesFromAst(ast)));
+	}
+
+	protected flatten<T extends AST>(array: T[][]): T[] {
+		return [].concat(...array);
+	}
+
+	protected expressionIsOrHasBindingPipe(exp: any): exp is BindingPipe {
 		if (exp.name && exp.name === TRANSLATE_PIPE_NAME) {
 			return true;
 		}

src/parsers/service.parser.ts

@@ -1,8 +1,17 @@
+import { ClassDeclaration, CallExpression } from 'typescript';
 import { tsquery } from '@phenomnomnominal/tsquery';
 
 import { ParserInterface } from './parser.interface';
 import { TranslationCollection } from '../utils/translation.collection';
-import { findClassDeclarations, findClassPropertyByType, findMethodCallExpressions, getStringsFromExpression } from '../utils/ast-helpers';
+import {
+	findClassDeclarations,
+	findClassPropertyByType,
+	findPropertyCallExpressions,
+	findMethodCallExpressions,
+	getStringsFromExpression,
+	findMethodParameterByType,
+	findConstructorDeclaration
+} from '../utils/ast-helpers';
 
 const TRANSLATE_SERVICE_TYPE_REFERENCE = 'TranslateService';
 const TRANSLATE_SERVICE_METHOD_NAMES = ['get', 'instant', 'stream'];
@@ -18,14 +27,13 @@ export class ServiceParser implements ParserInterface {
 
 		let collection: TranslationCollection = new TranslationCollection();
 
-		classDeclarations.forEach(classDeclaration => {
-			const propName: string = findClassPropertyByType(classDeclaration, TRANSLATE_SERVICE_TYPE_REFERENCE);
-			if (!propName) {
-				return;
-			}
+		classDeclarations.forEach((classDeclaration) => {
+			const callExpressions = [
+				...this.findConstructorParamCallExpressions(classDeclaration),
+				...this.findPropertyCallExpressions(classDeclaration)
+			];
 
-			const callExpressions = findMethodCallExpressions(classDeclaration, propName, TRANSLATE_SERVICE_METHOD_NAMES);
-			callExpressions.forEach(callExpression => {
+			callExpressions.forEach((callExpression) => {
 				const [firstArg] = callExpression.arguments;
 				if (!firstArg) {
 					return;
@@ -36,4 +44,21 @@ export class ServiceParser implements ParserInterface {
 		});
 		return collection;
 	}
+
+	protected findConstructorParamCallExpressions(classDeclaration: ClassDeclaration): CallExpression[] {
+		const constructorDeclaration = findConstructorDeclaration(classDeclaration);
+		if (!constructorDeclaration) {
+			return [];
+		}
+		const paramName = findMethodParameterByType(constructorDeclaration, TRANSLATE_SERVICE_TYPE_REFERENCE);
+		return findMethodCallExpressions(constructorDeclaration, paramName, TRANSLATE_SERVICE_METHOD_NAMES);
+	}
+
+	protected findPropertyCallExpressions(classDeclaration: ClassDeclaration): CallExpression[] {
+		const propName: string = findClassPropertyByType(classDeclaration, TRANSLATE_SERVICE_TYPE_REFERENCE);
+		if (!propName) {
+			return [];
+		}
+		return findPropertyCallExpressions(classDeclaration, propName, TRANSLATE_SERVICE_METHOD_NAMES);
+	}
 }

src/utils/ast-helpers.ts

@@ -1,15 +1,16 @@
 import { tsquery } from '@phenomnomnominal/tsquery';
 import {
+	SyntaxKind,
 	Node,
 	NamedImports,
 	Identifier,
 	ClassDeclaration,
-	CallExpression,
+	ConstructorDeclaration,
 	isStringLiteralLike,
 	isArrayLiteralExpression,
+	CallExpression,
 	Expression,
 	isBinaryExpression,
-	SyntaxKind,
 	isConditionalExpression,
 	PropertyAccessExpression
 } from 'typescript';
@@ -45,6 +46,30 @@ export function findClassPropertyByType(node: ClassDeclaration, type: string): s
 	return findClassPropertyConstructorParameterByType(node, type) || findClassPropertyDeclarationByType(node, type);
 }
 
+export function findConstructorDeclaration(node: ClassDeclaration): ConstructorDeclaration {
+	const query = `Constructor`;
+	const [result] = tsquery<ConstructorDeclaration>(node, query);
+	return result;
+}
+
+export function findMethodParameterByType(node: Node, type: string): string | null {
+	const query = `Parameter:has(TypeReference > Identifier[name="${type}"]) > Identifier`;
+	const [result] = tsquery<Identifier>(node, query);
+	if (result) {
+		return result.text;
+	}
+	return null;
+}
+
+export function findMethodCallExpressions(node: Node, propName: string, fnName: string | string[]): CallExpression[] {
+	if (Array.isArray(fnName)) {
+		fnName = fnName.join('|');
+	}
+	const query = `CallExpression > PropertyAccessExpression:has(Identifier[name=/^(${fnName})$/]):has(PropertyAccessExpression:has(Identifier[name="${propName}"]):not(:has(ThisKeyword)))`;
+	const nodes = tsquery<PropertyAccessExpression>(node, query).map((n) => n.parent as CallExpression);
+	return nodes;
+}
+
 export function findClassPropertyConstructorParameterByType(node: ClassDeclaration, type: string): string | null {
 	const query = `Constructor Parameter:has(TypeReference > Identifier[name="${type}"]):has(PublicKeyword,ProtectedKeyword,PrivateKeyword) > Identifier`;
 	const [result] = tsquery<Identifier>(node, query);
@@ -72,12 +97,12 @@ export function findFunctionCallExpressions(node: Node, fnName: string | string[
 	return nodes;
 }
 
-export function findMethodCallExpressions(node: Node, prop: string, fnName: string | string[]): CallExpression[] {
+export function findPropertyCallExpressions(node: Node, prop: string, fnName: string | string[]): CallExpression[] {
 	if (Array.isArray(fnName)) {
 		fnName = fnName.join('|');
 	}
 	const query = `CallExpression > PropertyAccessExpression:has(Identifier[name=/^(${fnName})$/]):has(PropertyAccessExpression:has(Identifier[name="${prop}"]):has(ThisKeyword))`;
-	const nodes = tsquery<PropertyAccessExpression>(node, query).map(n => n.parent as CallExpression);
+	const nodes = tsquery<PropertyAccessExpression>(node, query).map((n) => n.parent as CallExpression);
 	return nodes;
 }
 

src/utils/fs-helpers.ts

@@ -2,6 +2,12 @@ import * as os from 'os';
 import * as fs from 'fs';
 import * as braces from 'braces';
 
+declare module 'braces' {
+	interface Options {
+		keepEscaping?: boolean; // Workaround for option not present in @types/braces 3.0.0
+	}
+}
+
 export function normalizeHomeDir(path: string): string {
 	if (path.substring(0, 1) === '~') {
 		return `${os.homedir()}/${path.substring(1)}`;
@@ -10,17 +16,21 @@ export function normalizeHomeDir(path: string): string {
 }
 
 export function expandPattern(pattern: string): string[] {
-	return braces(pattern, { expand: true });
+	return braces(pattern, { expand: true, keepEscaping: true });
 }
 
 export function normalizePaths(patterns: string[], defaultPatterns: string[] = []): string[] {
-	return patterns.map(pattern =>
-		expandPattern(pattern).map(path => {
-			path = normalizeHomeDir(path);
-			if (fs.existsSync(path) && fs.statSync(path).isDirectory()) {
-				return defaultPatterns.map(defaultPattern => path + defaultPattern);
-			}
-			return path;
-		}).flat()
-	).flat();
+	return patterns
+		.map((pattern) =>
+			expandPattern(pattern)
+				.map((path) => {
+					path = normalizeHomeDir(path);
+					if (fs.existsSync(path) && fs.statSync(path).isDirectory()) {
+						return defaultPatterns.map((defaultPattern) => path + defaultPattern);
+					}
+					return path;
+				})
+				.flat()
+		)
+		.flat();
 }

src/utils/translation.collection.ts

@@ -14,21 +14,18 @@ export class TranslationCollection {
 	}
 
 	public addKeys(keys: string[]): TranslationCollection {
-		const values = keys.reduce(
-			(results, key) => {
-				return { ...results, [key]: '' };
-			},
-			{} as TranslationType
-		);
+		const values = keys.reduce((results, key) => {
+			return { ...results, [key]: '' };
+		}, {} as TranslationType);
 		return new TranslationCollection({ ...this.values, ...values });
 	}
 
 	public remove(key: string): TranslationCollection {
-		return this.filter(k => key !== k);
+		return this.filter((k) => key !== k);
 	}
 
 	public forEach(callback: (key?: string, val?: string) => void): TranslationCollection {
-		Object.keys(this.values).forEach(key => callback.call(this, key, this.values[key]));
+		Object.keys(this.values).forEach((key) => callback.call(this, key, this.values[key]));
 		return this;
 	}
 
@@ -56,7 +53,7 @@ export class TranslationCollection {
 
 	public intersect(collection: TranslationCollection): TranslationCollection {
 		const values: TranslationType = {};
-		this.filter(key => collection.has(key)).forEach((key, val) => {
+		this.filter((key) => collection.has(key)).forEach((key, val) => {
 			values[key] = val;
 		});
 
@@ -87,7 +84,7 @@ export class TranslationCollection {
 		const values: TranslationType = {};
 		this.keys()
 			.sort(compareFn)
-			.forEach(key => {
+			.forEach((key) => {
 				values[key] = this.get(key);
 			});
 

tests/compilers/po.compiler.spec.ts

@@ -0,0 +1,24 @@
+import { expect } from 'chai';
+
+import { TranslationCollection } from '../../src/utils/translation.collection';
+import { PoCompiler } from '../../src/compilers/po.compiler';
+
+describe('PoCompiler', () => {
+	let compiler: PoCompiler;
+
+	beforeEach(() => {
+		compiler = new PoCompiler();
+	});
+
+	it('should still include html ', () => {
+		const collection = new TranslationCollection({
+			'A <strong>test</strong>': 'Un <strong>test</strong>',
+			'With a lot of <em>html</em> included': 'Avec beaucoup d\'<em>html</em> inclus'
+		});
+		const result: Buffer = Buffer.from(compiler.compile(collection));
+		expect(result.toString('utf8')).to.equal('msgid ""\nmsgstr ""\n"mime-version: 1.0\\n"\n"Content-Type: text/plain; charset=utf-8\\n"\n"Content-Transfer-Encoding: 8bit\\n"\n\nmsgid "A <strong>test</strong>"\nmsgstr "Un <strong>test</strong>"\n\nmsgid "With a lot of <em>html</em> included"\nmsgstr "Avec beaucoup d\'<em>html</em> inclus"');
+	});
+});
+
+
+

tests/parsers/directive.parser.spec.ts

@@ -36,6 +36,12 @@ describe('DirectiveParser', () => {
 		expect(keys).to.deep.equal(['Hello <strong translate>World</strong>']);
 	});
 
+	it('should not exclude html tags in children', () => {
+		const contents = `<div translate>Hello <strong>World</strong></div>`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['Hello <strong>World</strong>']);
+	});
+
 	it('should extract and parse inline template', () => {
 		const contents = `
 			@Component({
@@ -85,4 +91,54 @@ describe('DirectiveParser', () => {
 		const keys = parser.extract(contents, componentFilename).keys();
 		expect(keys).to.deep.equal([]);
 	});
+
+	it('should extract contents without line breaks', () => {
+		const contents = `
+			<p translate>
+				Please leave a message for your client letting them know why you 
+				rejected the field and what they need to do to fix it.
+			</p>
+		`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal([
+			'Please leave a message for your client letting them know why you rejected the field and what they need to do to fix it.'
+		]);
+	});
+
+	it('should extract contents without indent spaces', () => {
+		const contents = `
+			<div *ngIf="!isLoading && studentsToGrid && studentsToGrid.length == 0" class="no-students" mt-rtl translate>There 
+				are currently no students in this class. The good news is, adding students is really easy! Just use the options 
+				at the top.
+			</div>
+		`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal([
+			'There are currently no students in this class. The good news is, adding students is really easy! Just use the options at the top.'
+		]);
+	});
+
+	it('should extract contents without indent spaces', () => {
+		const contents = `<button mat-button (click)="search()" translate>client.search.searchBtn</button>`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['client.search.searchBtn']);
+	});
+
+	it('should extract contents without indent spaces and trim leading/trailing whitespace', () => {
+		const contents = `
+			<div translate>
+				this is an example 
+				of a long label 
+			</div>
+
+			<div>
+				<p translate>
+					this is an example 
+					of a long label 
+				</p>
+			</div>
+		`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['this is an example of a long label']);
+	});
 });

tests/parsers/marker.parser.spec.ts

@@ -35,4 +35,30 @@ describe('MarkerParser', () => {
 		const keys = parser.extract(contents, componentFilename).keys();
 		expect(keys).to.deep.equal(['Hello world', 'This is a very very very very long line.', 'Mix of different types']);
 	});
+
+	it('should extract split strings while keeping html tags', () => {
+		const contents = `
+			import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
+			_('Hello ' + 'world');
+			_('This <em>is</em> a ' + 'very ' + 'very ' + 'very ' + 'very ' + 'long line.');
+			_('Mix ' + \`of \` + 'different ' + \`types\`);
+		`;
+		const keys = parser.extract(contents, componentFilename).keys();
+		expect(keys).to.deep.equal(['Hello world', 'This <em>is</em> a very very very very long line.', 'Mix of different types']);
+	});
+
+	it('should extract the strings', () => {
+		const contents = `
+		import { marker } from '@biesbjerg/ngx-translate-extract-marker';
+
+		export class AppModule {
+			constructor() {
+				marker('DYNAMIC_TRAD.val1');
+				marker('DYNAMIC_TRAD.val2');
+			}
+		}
+		`;
+		const keys = parser.extract(contents, componentFilename).keys();
+		expect(keys).to.deep.equal(['DYNAMIC_TRAD.val1', 'DYNAMIC_TRAD.val2']);
+	});
 });

tests/parsers/pipe.parser.spec.ts

@@ -47,12 +47,48 @@ describe('PipeParser', () => {
 		expect(keys).to.deep.equal(['Hello', 'World']);
 	});
 
+	it('should extract strings from ternary operators right expression', () => {
+		const contents = `{{ condition ? null : ('World' | translate) }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['World']);
+	});
+
+	it('should extract strings from ternary operators inside attribute bindings', () => {
+		const contents = `<span [attr]="condition ? null : ('World' | translate)"></span>`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['World']);
+	});
+
+	it('should extract strings from ternary operators left expression', () => {
+		const contents = `{{ condition ? ('World' | translate) : null }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['World']);
+	});
+
+	it('should extract strings inside string concatenation', () => {
+		const contents = `{{ 'a' + ('Hello' | translate) + 'b' + 'c' + ('World' | translate) + 'd' }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['Hello', 'World']);
+	});
+
+	it('should extract strings from object', () => {
+		const contents = `{{ { foo: 'Hello' | translate, bar: ['World' | translate], deep: { nested: { baz: 'Yes' | translate } } } | json }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['Hello', 'World', 'Yes']);
+	});
+
 	it('should extract strings from ternary operators inside attribute bindings', () => {
 		const contents = `<span [attr]="(condition ? 'Hello' : 'World') | translate"></span>`;
 		const keys = parser.extract(contents, templateFilename).keys();
 		expect(keys).to.deep.equal(['Hello', 'World']);
 	});
 
+	it('should extract strings from nested expressions', () => {
+		const contents = `<span [attr]="{ foo: ['a' + ((condition ? 'Hello' : 'World') | translate) + 'b'] }"></span>`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal(['Hello', 'World']);
+	});
+
 	it('should extract strings from nested ternary operators ', () => {
 		const contents = `<h3>{{ (condition ? 'Hello' : anotherCondition ? 'Nested' : 'World' ) | translate }}</h3>`;
 		const keys = parser.extract(contents, templateFilename).keys();
@@ -147,4 +183,16 @@ describe('PipeParser', () => {
 		const keys = parser.extract(contents, templateFilename).keys();
 		expect(keys).to.deep.equal(['message']);
 	});
+
+	it('should ignore calculated values', () => {
+		const contents = `{{ 'SOURCES.' + source.name + '.NAME_PLURAL' | translate }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal([]);
+	});
+
+	it('should not extract pipe argument', () => {
+		const contents = `{{ value | valueToTranslationKey: 'argument' | translate }}`;
+		const keys = parser.extract(contents, templateFilename).keys();
+		expect(keys).to.deep.equal([]);
+	});
 });

tests/parsers/service.parser.spec.ts

@@ -11,6 +11,18 @@ describe('ServiceParser', () => {
 		parser = new ServiceParser();
 	});
 
+	it('should extract strings when TranslateService is accessed directly via constructor parameter', () => {
+		const contents = `
+			@Component({ })
+			export class MyComponent {
+				public constructor(protected translateService: TranslateService) {
+					translateService.get('It works!');
+				}
+		`;
+		const keys = parser.extract(contents, componentFilename).keys();
+		expect(keys).to.deep.equal(['It works!']);
+	});
+
 	it('should support extracting binary expressions', () => {
 		const contents = `
 			@Component({ })

tsconfig.json

@@ -1,17 +1,15 @@
 {
     "compilerOptions": {
         "allowSyntheticDefaultImports": true,
-        "noUnusedLocals": true,
         "noImplicitAny": true,
         "noImplicitReturns": true,
         "noImplicitThis": true,
         "noImplicitUseStrict": true,
         "removeComments": true,
         "declaration": true,
-        "target": "es2015",
+        "target": "es2019",
         "lib": [
-            "dom",
-            "esnext.array"
+            "es2019"
         ],
         "module": "commonjs",
         "outDir": "dist",

tslint.json

@@ -112,6 +112,7 @@
       "check-operator",
       "check-separator",
       "check-type"
-    ]
+    ],
+    "quotemark": [true, "single"]
   }
 }