Typescript - ReferenceError: Exporte sind nicht definiert

Question

In meiner Konsole bekomme ich ReferenceError: exports is not defined als Fehler.

Code:

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"] 
    }, 
}; 

Was mache ich hier falsch?

BEARBEITEN: Ich habe meine Frage mit webpack.config.js und tsconfig.json bearbeitet. Es könnte auch erwähnenswert sein, dass ich die Dateien in meinem Chrome-Browser direkt von Webstorm aus anschaue. Könnte das ein Problem sein?

Vielen Dank.

Answer 1

Versuch, um "allowJs": false

Oder die webpack Konfigurationsdatei aus dem Typoskript Compiler auszuschließen Verwendung auszuschließen https://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Answer 2

Wenn Sie CommonJS-Module exportieren, kann dies mit Ihren Typoskript-Konfigurationsoptionen zusammenhängen. Sie können dies beheben, indem Sie Ihr Bundle über das Befehlszeilendienstprogramm Browserify ausführen. Siehe http://thejsguy.com/javascript/browserify/2015/01/05/browserify-getting-started.html