Javascript Typescript-ReferenceError:未定义导出

在我的控制台中，我不断得到

ReferenceError:exports未定义为错误

代码：

app.ts：

import {IDetails} from "./interfaces/IDetails";

class MyClass implements IDetails{
    constructor(){}

    public render (elem: string, text: string) {
        let el: HTMLElement = document.querySelector(elem);
        el.textContent = text;
        el.innerText = text;
    }
}

window.onload = () => {
    let myClass = new MyClass();
    myClass.render('body', 'Hello World!');
};

IDetails.ts：

export interface IDetails {
    elem: string,
    text: string
}

tsconfig.json：

{
  "compilerOptions": {
    "outDir": "./build/",
    "sourceMap": true,
    "noImplicitAny": false,
    "module": "commonjs",
    "target": "es5",
    "removeComments": true,
    "allowJs": true
  }
}

webpack.config.js：

module.exports = {
    entry: './index.ts',
    output: {
        filename: 'bundle.js',
        path: __dirname
    },
    watch: true,
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                loader: "ts-loader",
                options: {
                    transpileOnly: true
                }
            }
        ]
    },
    resolve: {
        extensions: [".tsx", ".ts", ".js"]
    },
};

我做错了什么

编辑：我已经用
webpack.config.js
和
tsconfig.json
编辑了我的问题。还值得注意的是，我正在Chrome浏览器中直接从Webstorm查看文件。这可能是个问题吗

谢谢。
如果您正在导出CommonJS模块，它可能与您的Typescript配置选项有关。您可以通过名为Browserify的命令行实用程序运行包来修复此问题。请参见尝试设置“allowJs”：false

或者使用exclude从typescript编译器中排除webpack配置文件，这是在Node.js中吗？我直接从Webstorm查看。请检查我的编辑。我遇到了相同的问题，并尝试修复了几分钟，但没有任何效果，问题是我的输出文件在根目录中，但webpack正在dist/目录中创建文件。我正在根目录中使用旧的文件：facepalm：我已经用tsconfig.json和webpack.config.js编辑了我的问题，为什么要排除webpack.config.js帮助？谢谢。因为您的错误似乎与网页文件中的module.exports函数有关