webpack ts编译失败后依旧生成bundle文件

Question

我自己在本地测试webpack ts-loader编译tsx文件。发现ts提示编译错误webpack依旧可以生成bundle文件，有人知道这是为啥吗？

文件结构如下：

package.json:

{
  "name": "ts1",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "clean-webpack-plugin": "^3.0.0",
    "webpack-dev-server": "^3.11.0"
  },
  "dependencies": {
    "@types/react": "^18.0.1",
    "@types/react-dom": "^18.0.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "ts-loader": "^8.3.0",
    "typescript": "^4.6.3",
    "webpack": "^4.46.0",
    "webpack-bundle-analyzer": "^4.5.0",
    "webpack-cli": "^3.3.12"
  }
}

tsconfig.json:

{
  "compilerOptions": {
    "target": "esnext",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
    "jsx": "react",                                /* Specify what JSX code is generated. */
    "module": "es6",                                /* Specify what module code is generated. */
    "baseUrl": "./src",                                  /* Specify the base directory to resolve non-relative module names. */
    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */
    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
  }
}

webpack.config.js

const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
  entry: {
    'entry': './src/index.tsx'
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].js',
  },
  mode: 'development',
  module: {
    rules: [
      { test: /\.tsx?$/, loader: "ts-loader" }
    ]
  },
  plugins:[
    new CleanWebpackPlugin(),
  ],
  resolve: {
    extensions: [".ts", ".tsx", ".js"]
  },
}

src/index.tsx:

import React from 'react';
import ReactDOM from 'react-dom';
// 我故意在App里用了一个未定义变量d，让它编译报错
const App:React.FC<{}> = () => {
  return <>
  i am App  {d}
  </>
}

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

然后当我执行npm run build的时候，dist目录下生成了bundle文件entry.js, 如果ts编译出错，有什么办法可以阻止webpack生成最终的bundle文件呢？