(fix): parse tsconfig extends, trailing commas, and comments

- use ts.readConfigFile to properly parse a commas and comments from
  tsconfig instead of just trying to readJSON
- use ts.parseJsonConfigFileContent to properly parse `extends` and
  get recursive compilerOptions

- add tests for all of the above use cases
  - add them to build-withTsconfig which changes declarationDir;
    should only work if TSDX properly parses the tsconfig

NOTE: this is only necessary for internal, TSDX-specific parsing of
tsconfig.json. rollup-plugin-typescript2 already handles these options,
but internal options like esModuleInterop etc are also used & parsed
independently of rpts2

src/createRollupConfig.ts

@@ -1,4 +1,9 @@
-import { safeVariableName, safePackageName, external } from './utils';
+import {
+  safeVariableName,
+  safePackageName,
+  external,
+  getTsconfigCompilerOptions,
+} from './utils';
 import { paths } from './constants';
 import { RollupOptions } from 'rollup';
 import { terser } from 'rollup-plugin-terser';
@@ -10,10 +15,11 @@ import replace from '@rollup/plugin-replace';
 import resolve from '@rollup/plugin-node-resolve';
 import sourceMaps from 'rollup-plugin-sourcemaps';
 import typescript from 'rollup-plugin-typescript2';
+import ts from 'typescript';
+
 import { extractErrors } from './errors/extractErrors';
 import { babelPluginTsdx } from './babelPluginTsdx';
 import { TsdxOptions } from './types';
-import * as fs from 'fs-extra';
 
 const errorCodeOpts = {
   errorMapFilePath: paths.appErrorsJson,
@@ -43,10 +49,8 @@ export async function createRollupConfig(
     .filter(Boolean)
     .join('.');
 
-  let tsconfigJSON;
-  try {
-    tsconfigJSON = await fs.readJSON(opts.tsconfig || paths.tsconfigJson);
-  } catch (e) {}
+  const tsconfigPath = opts.tsconfig || paths.tsconfigJson;
+  const tsCompilerOptions = getTsconfigCompilerOptions(tsconfigPath);
 
   return {
     // Tell Rollup the entry point to the package
@@ -89,7 +93,7 @@ export async function createRollupConfig(
       // (i.e. import * as namespaceImportObject from...) that are accessed dynamically.
       freeze: false,
       // Respect tsconfig esModuleInterop when setting __esModule.
-      esModule: tsconfigJSON ? tsconfigJSON.esModuleInterop : false,
+      esModule: tsCompilerOptions ? tsCompilerOptions.esModuleInterop : false,
       name: opts.name || safeVariableName(opts.name),
       sourcemap: true,
       globals: { react: 'React', 'react-native': 'ReactNative' },
@@ -136,7 +140,7 @@ export async function createRollupConfig(
         },
       },
       typescript({
-        typescript: require('typescript'),
+        typescript: ts,
         cacheRoot: `./node_modules/.cache/tsdx/${opts.format}/`,
         tsconfig: opts.tsconfig,
         tsconfigDefaults: {
@@ -165,9 +169,7 @@ export async function createRollupConfig(
           },
         },
         check: !opts.transpileOnly,
-        useTsconfigDeclarationDir: Boolean(
-          tsconfigJSON?.compilerOptions?.declarationDir
-        ),
+        useTsconfigDeclarationDir: Boolean(tsCompilerOptions?.declarationDir),
       }),
       babelPluginTsdx({
         exclude: 'node_modules/**',

src/utils.ts

@@ -1,6 +1,8 @@
 import fs from 'fs-extra';
 import path from 'path';
 import camelCase from 'camelcase';
+import ts from 'typescript';
+
 import { PackageJson } from './types';
 
 // Remove the package name scope if it exists
@@ -50,3 +52,21 @@ export function getReactVersion({
 export function getNodeEngineRequirement({ engines }: PackageJson) {
   return engines && engines.node;
 }
+
+// borrowed from https://stackoverflow.com/a/53898219/1046439
+// recommended in https://github.com/TypeStrong/tsconfig/issues/21#issuecomment-560170429
+export function getTsconfigCompilerOptions(
+  tsconfigPath: string
+): ts.CompilerOptions {
+  const tsconfigJSON = ts.readConfigFile(tsconfigPath, ts.sys.readFile).config;
+
+  const parseConfigHost: ts.ParseConfigHost = {
+    fileExists: ts.sys.fileExists,
+    readFile: ts.sys.readFile,
+    readDirectory: ts.sys.readDirectory,
+    useCaseSensitiveFileNames: true,
+  };
+
+  return ts.parseJsonConfigFileContent(tsconfigJSON, parseConfigHost, './')
+    .options;
+}

test/fixtures/build-withTsconfig/tsconfig.base.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "module": "ESNext",
+    "lib": ["dom", "esnext"],
+    "declaration": true,
+    "declarationDir": "typings",
+    "declarationMap": true,
+    "sourceMap": true,
+    "rootDir": "./src",
+    "strict": true,
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictPropertyInitialization": true,
+    "noImplicitThis": true,
+    "alwaysStrict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "moduleResolution": "node",
+    "baseUrl": "./",
+    "paths": {
+      "*": ["src/*", "node_modules/*"]
+    },
+    "jsx": "react",
+    "esModuleInterop": true
+  },
+  "include": ["src", "types"], // test parsing of trailing comma & comment
+}

test/fixtures/build-withTsconfig/tsconfig.json

@@ -1,30 +1,4 @@
 {
-  "compilerOptions": {
-    "module": "ESNext",
-    "lib": ["dom", "esnext"],
-    "declaration": true,
-    "declarationDir": "typings",
-    "declarationMap": true,
-    "sourceMap": true,
-    "rootDir": "./src",
-    "strict": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "strictFunctionTypes": true,
-    "strictPropertyInitialization": true,
-    "noImplicitThis": true,
-    "alwaysStrict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-    "moduleResolution": "node",
-    "baseUrl": "./",
-    "paths": {
-      "*": ["src/*", "node_modules/*"]
-    },
-    "jsx": "react",
-    "esModuleInterop": true
-  },
-  "include": ["src", "types"]
+  // ensure that extends works (trailing comma & comment too)
+  "extends": "./tsconfig.base.json",
 }