fix: compatibility with ts-loader (#183)

Author: alexander-akait

package-lock.json

@@ -44,7 +44,6 @@
     "webpack": "^5.0.0"
   },
   "dependencies": {
-    "cspell": "^6.31.1",
     "json-parse-better-errors": "^1.0.2",
     "loader-runner": "^4.1.0",
     "neo-async": "^2.6.2",
@@ -61,6 +60,7 @@
     "babel-loader": "^9.1.2",
     "cross-env": "^7.0.2",
     "css-loader": "^6.7.3",
+    "cspell": "^6.31.1",
     "del": "^5.1.0",
     "del-cli": "^5.0.0",
     "eslint": "^8.39.0",
@@ -81,6 +81,7 @@
     "sass": "^1.62.1",
     "sass-loader": "^11.0.1",
     "standard-version": "^9.0.0",
+    "ts-loader": "^9.2.6",
     "webpack": "^5.81.0"
   },
   "keywords": [

package.json

@@ -19,7 +19,10 @@ function pitch() {
           ident: l.ident,
         };
       }),
-      _compiler: { fsStartTime: this._compiler.fsStartTime },
+      _compiler: {
+        fsStartTime: this._compiler.fsStartTime,
+        options: { plugins: [] },
+      },
       _compilation: {
         outputOptions: {
           hashSalt: this._compilation.outputOptions.hashSalt,

src/index.js

@@ -0,0 +1 @@
+$white: #FFFFFF;

test/ts-loader-example/assets/color_palette.scss

@@ -0,0 +1,3 @@
+const foo: string = 'foo';
+
+console.log(foo);

test/ts-loader-example/index.ts

@@ -0,0 +1 @@
+{}

test/ts-loader-example/package.json

@@ -0,0 +1,40 @@
+const path = require('path');
+
+const threadLoader = require('../../src'); // eslint-disable-line import/no-extraneous-dependencies
+
+module.exports = (env) => {
+  const workerPool = {
+    workers: +env.threads,
+    poolTimeout: env.watch ? Infinity : 2000,
+  };
+  if (+env.threads > 0) {
+    threadLoader.warmup(workerPool, ['ts-loader']);
+  }
+  return {
+    mode: 'none',
+    context: __dirname,
+    devtool: false,
+    entry: ['./index.ts'],
+    output: {
+      path: path.resolve('dist'),
+      filename: 'bundle.js',
+    },
+    module: {
+      rules: [
+        {
+          test: /\.ts$/,
+          use: [
+            env.threads !== 0 && {
+              loader: path.resolve(__dirname, '../../dist/index.js'),
+              options: workerPool,
+            },
+            { loader: 'ts-loader', options: { happyPackMode: true } },
+          ].filter(Boolean),
+        },
+      ],
+    },
+    stats: {
+      children: false,
+    },
+  };
+};

test/ts-loader-example/webpack.config.js

@@ -1,6 +1,7 @@
 import webpack from 'webpack';
 
 import sassLoaderConfig from './sass-loader-example/webpack.config';
+import tsLoaderConfig from './ts-loader-example/webpack.config';
 
 test("Processes sass-loader's @import correctly", (done) => {
   const config = sassLoaderConfig({});
@@ -21,3 +22,23 @@ test("Processes sass-loader's @import correctly", (done) => {
     done();
   });
 }, 30000);
+
+test('Processes ts-loader correctly', (done) => {
+  const config = tsLoaderConfig({});
+
+  webpack(config, (err, stats) => {
+    if (err) {
+      // eslint-disable-next-line no-console
+      console.error(err);
+    }
+
+    expect(err).toBe(null);
+
+    if (stats.hasErrors()) {
+      // eslint-disable-next-line no-console
+      console.error(stats.toJson().errors);
+    }
+    expect(stats.hasErrors()).toBe(false);
+    done();
+  });
+}, 30000);