TypeStrong / TypeStrong/ts-loader

Typescript type validation error in ts-loader

Open
#1,654 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
3.5k
Forks
439
Avg merge
17h 17m
Merged PRs (30d)
2

Description

webpack config

{
        test: /\.ts$/,
        use: [
          /* config.module.rule('ts').use('thread-loader') */
          {
            loader: '/Users/mouyong/company/leo-web-ai/node_modules/thread-loader/dist/cjs.js'
          },
          /* config.module.rule('ts').use('babel-loader') */
          {
            loader: '/Users/mouyong/company/leo-web-ai/node_modules/@vue/cli-plugin-typescript/node_modules/babel-loader/lib/index.js'
          },
          /* config.module.rule('ts').use('ts-loader') */
          {
            loader: '/Users/mouyong/company/leo-web-ai/node_modules/ts-loader/index.js',
            options: {
              transpileOnly: true,
              appendTsSuffixTo: [
                '\\.vue$'
              ],
              happyPackMode: true
            }
          },
          /* config.module.rule('ts').use('customPathReplacementLoader') */
          {
            loader: 'web-monorepo-custom-alias'
          }
        ]

The code implementation of web-monorepo-custom-alias is as follows

const path = require('path');
const fs = require('fs');
module.exports = function (source) {
    const callback = this.async();
    if (this.resourcePath.includes('src/utils/aiAnswer/AIAnswerScheduler')) {
        console.log(this.resourcePath)
        source = source.replaceAll('@/services/ai-answer', '../../services/ai-answer')
    }
    callback(null, source)
};

ts-loader still reports the problem that @/services/ai-answer cannot be found,Because typescript in ts-loader does type checking and does not use the replaced content

How to make typescript in ts-loader use the replaced content

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the webpack configuration and the interaction among thread-loader, babel-loader, ts-loader, and the custom web-monorepo-custom-alias loader. Reproduce the unresolved @/services/ai-answer error and trace how ts-loader performs type checking relative to transformed content; done means the intended alias replacement is reflected in TypeScript validation.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript, webpack
Domain
build-system, tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.