refactor: use TypeScript-provided lib and consistent imports (#213)

Author: jakebailey

src/helpers/__tests__/getDtsSnapshot.test.ts

@@ -2,7 +2,7 @@ import { readFileSync } from 'fs';
 import { join } from 'path';
 import postcssImportSync from 'postcss-import-sync2';
 import postcssPresetEnv from 'postcss-preset-env';
-import tsModule from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 import { CSSExportsWithSourceMap, getCssExports } from '../getCssExports';
 import { createDtsExports } from '../createDtsExports';
 import { Logger } from '../logger';

src/helpers/getCssExports.ts

@@ -5,7 +5,7 @@ import sass from 'sass';
 import stylus from 'stylus';
 import { CSSExports, extractICSS } from 'icss-utils';
 import { RawSourceMap } from 'source-map-js';
-import tsModule from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 import { createMatchPath } from 'tsconfig-paths';
 import { sassTildeImporter } from '../importers/sassTildeImporter';
 import { Options, CustomRenderer } from '../options';

src/helpers/getDtsSnapshot.ts

@@ -1,5 +1,5 @@
 import { readFileSync } from 'fs';
-import tsModule from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 import { Options } from '../options';
 import { getCssExports } from './getCssExports';
 import { createDtsExports } from './createDtsExports';

src/helpers/logger.ts

@@ -1,11 +1,13 @@
-import { server } from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 
 export interface Logger {
   log: (message: string) => void;
   error: (error: unknown) => void;
 }
 
-export const createLogger = (info: server.PluginCreateInfo): Logger => {
+export const createLogger = (
+  info: tsModule.server.PluginCreateInfo,
+): Logger => {
   const log = (message: string) => {
     info.project.projectService.logger.info(
       `[typescript-plugin-css-modules] ${message}`,

src/index.ts

@@ -3,22 +3,14 @@ import path from 'path';
 import dotenv from 'dotenv';
 import { AcceptedPlugin } from 'postcss';
 import postcssrc from 'postcss-load-config';
-import { server } from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 import { Options } from './options';
 import { createMatchers } from './helpers/createMatchers';
 import { isCSSFn } from './helpers/cssExtensions';
 import { getDtsSnapshot } from './helpers/getDtsSnapshot';
 import { createLogger } from './helpers/logger';
 import { getProcessor } from './helpers/getProcessor';
 import { filterPlugins } from './helpers/filterPlugins';
-import {
-  createLanguageService,
-  Extension,
-  LanguageService,
-  LanguageServiceHost,
-  ResolvedModuleFull,
-  ScriptKind,
-} from 'typescript';
 
 const getPostCssConfigPlugins = (directory: string) => {
   try {
@@ -28,25 +20,27 @@ const getPostCssConfigPlugins = (directory: string) => {
   }
 };
 
-const init: server.PluginModuleFactory = ({ typescript: ts }) => {
+const init: tsModule.server.PluginModuleFactory = ({ typescript: ts }) => {
   let _isCSS: isCSSFn;
 
-  function create(info: server.PluginCreateInfo): LanguageService {
+  function create(
+    info: tsModule.server.PluginCreateInfo,
+  ): tsModule.LanguageService {
     const logger = createLogger(info);
     const directory = info.project.getCurrentDirectory();
     const compilerOptions = info.project.getCompilerOptions();
 
-    const languageServiceHost = {} as Partial<LanguageServiceHost>;
+    const languageServiceHost = {} as Partial<tsModule.LanguageServiceHost>;
 
     const languageServiceHostProxy = new Proxy(info.languageServiceHost, {
-      get(target, key: keyof LanguageServiceHost) {
+      get(target, key: keyof tsModule.LanguageServiceHost) {
         return languageServiceHost[key]
           ? languageServiceHost[key]
           : target[key];
       },
     });
 
-    const languageService = createLanguageService(languageServiceHostProxy);
+    const languageService = ts.createLanguageService(languageServiceHostProxy);
 
     // TypeScript plugins have a `cwd` of `/`, which causes issues with import resolution.
     process.chdir(directory);
@@ -123,10 +117,10 @@ const init: server.PluginModuleFactory = ({ typescript: ts }) => {
 
     languageServiceHost.getScriptKind = (fileName) => {
       if (!info.languageServiceHost.getScriptKind) {
-        return ScriptKind.Unknown;
+        return ts.ScriptKind.Unknown;
       }
       if (isCSS(fileName)) {
-        return ScriptKind.TS;
+        return ts.ScriptKind.TS;
       }
       return info.languageServiceHost.getScriptKind(fileName);
     };
@@ -148,10 +142,10 @@ const init: server.PluginModuleFactory = ({ typescript: ts }) => {
 
     const createModuleResolver =
       (containingFile: string) =>
-      (moduleName: string): ResolvedModuleFull | undefined => {
+      (moduleName: string): tsModule.ResolvedModuleFull | undefined => {
         if (isRelativeCSS(moduleName)) {
           return {
-            extension: Extension.Dts,
+            extension: ts.Extension.Dts,
             isExternalLibraryImport: false,
             resolvedFileName: path.resolve(
               path.dirname(containingFile),
@@ -203,7 +197,7 @@ const init: server.PluginModuleFactory = ({ typescript: ts }) => {
 
           if (cssModulePath) {
             return {
-              extension: Extension.Dts,
+              extension: ts.Extension.Dts,
               isExternalLibraryImport: false,
               resolvedFileName: path.resolve(cssModulePath),
             };
@@ -279,7 +273,9 @@ const init: server.PluginModuleFactory = ({ typescript: ts }) => {
     return languageService;
   }
 
-  function getExternalFiles(project: server.ConfiguredProject): string[] {
+  function getExternalFiles(
+    project: tsModule.server.ConfiguredProject,
+  ): string[] {
     return project.getFileNames().filter(_isCSS);
   }
 

src/options.ts

@@ -1,5 +1,5 @@
 import { Options as SassOptions } from 'sass';
-import tsModule from 'typescript/lib/tsserverlibrary';
+import type tsModule from 'typescript/lib/tsserverlibrary';
 import { DotenvConfigOptions } from 'dotenv';
 import { CSSExports } from 'icss-utils';
 import stylus from 'stylus';