为何未安装typescript，ts-loader仍能正常完成webpack构建？

使用ts-loader的npm文档及webpack官方TypeScript指南均要求安装typescript，但未说明背后原因。我在未安装typescript的情况下，项目仍能成功构建，想了解其中缘由。

当前配置及构建输出 #

webpack.config.js #

const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    // mode: 'development',
    entry: './src/index.ts',
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: 'ts-loader'
            }
        ]
    },
    output: {
        filename: "bundle.js",
    },
    plugins: [
        new HtmlWebpackPlugin(),
        new webpack.ProgressPlugin()
    ]
}

package.json #

{
  ...
  "scripts": {
    "webpack": "webpack",
    "build:dev": "npm run webpack -- --mode development",
    "start": "npm run webpack serve -- --mode development"
  },
  "author": "ranemihir",
  "license": "ISC",
  "devDependencies": {
    "html-webpack-plugin": "^5.5.3",
    "ts-loader": "^9.4.4",
    "webpack": "^5.88.2",
    "webpack-cli": "^5.1.4",
    "webpack-dev-server": "^4.15.1"
  }
}

构建输出 #

asset bundle.js 1.3 KiB [compared for emit] (name: main)
asset index.html 233 bytes [compared for emit]
./src/index.ts 111 bytes [built] [code generated]
webpack 5.88.2 compiled successfully in 2099 ms

你之所以能在没显式安装typescript的情况下完成构建，核心原因是**ts-loader本身的依赖列表里已经包含了typescript**。当你通过npm安装ts-loader时，会自动拉取它的所有依赖包，其中就包括TypeScript编译器，所以项目能间接拿到编译所需的工具，完成TS文件转译。

而官方文档要求显式安装typescript，主要有这几个实际意义：

• 版本自主控制：ts-loader依赖的TypeScript版本是固定范围的，显式安装后你可以自己选择适配项目的版本，不会因为ts-loader更新而被动升级编译器，避免出现兼容性问题。
• 支持更多场景：显式安装TypeScript后，你可以直接执行tsc命令做单独编译、类型检查，或者自定义tsconfig.json的更多配置，这些操作在仅依赖ts-loader隐式安装的TypeScript时会受限。
• 依赖关系透明：把typescript写进package.json能让项目的依赖更清晰，其他开发者接手时一眼就能知道项目用到了TypeScript，不会因为隐式依赖导致本地构建失败。

内容的提问来源于stack exchange，提问作者Mihir Rane