带有 typescript 的 Webpack 得到 TypeScript 没有输出错误

Posted 2023-03-13

【中文标题】带有 typescript 的 Webpack 得到 TypeScript 没有输出错误

【英文标题】：Webpack with typescript getting TypeScript emitted no output error

【发布时间】：2019-08-13 17:23:51

【问题描述】：

我从https://www.npmjs.com/package/ts-loader得到这个配置：

webpack.config.js：

var path = require('path');
var webpack = require('webpack');

module.exports = 
    mode: "development",
    devtool: "inline-source-map",
    entry: "./src/Api.ts",
    output: 
        filename: "bundle.js"
    ,
    resolve: 
        // Add `.ts` and `.tsx` as a resolvable extension.
        extensions: [".ts", ".tsx", ".js"]
    ,
    module: 
        rules: [
            // all files with a `.ts` or `.tsx` extension will be handled by `ts-loader`
             test: /\.tsx?$/, loader: "ts-loader" 
        ]
    
;

./src/Api.ts:

export class Api 
...

但是当我运行 webpack 时，我得到：

Error: TypeScript emitted no output for Api.ts

【问题讨论】：

（只是在黑暗中拍摄）您是否偶然在与您的 ts 相同的目录中有任何过时的已编译 javascript？我有一个类似的问题，最终是由一些过时的编译文件引起的。

@Code2Code 否，已清理所有内容。是否有足够的 export class Api ... 或者我也需要在该文件中实例化它？

导出就够了，因为 TS 是一个静态类型检查器。

【参考方案1】：

检查您的 tsconfig.json 文件中是否没有将 noEmit 设置为 true。

【讨论】：

是的，它是这样工作的，但是没有创建 js 文件。我期待 webpack 会创建一个 bundle.js 文件

"noEmit": false 是必要的，但还要确保要捆绑的文件（及其引用）在 tsconfig.json 的“包含”中。没想到 Webpack 会出现 noEmit 问题。

还要检查noEmitOnError 是否未设置为true！

【参考方案2】：

首先将 webpack 配置条目如 index.js 更改为 index.tsx。 其次确保为 tsx 文件添加了规则，例如：

  test: /\.(ts|js)x?$/,
  exclude: /node_modules/,
  use: 
    loader: "babel-loader",
    options: 
      presets: [
        "@babel/preset-env",
        "@babel/preset-react",
        "@babel/preset-typescript",
      ],
    ,
  ,
,

【讨论】：

为什么不将ts-loader 与ts 文件一起使用？ @Soshiv Upreti

查看***.com/questions/49624202/…@Dolphin