typescript 打字稿 - ReferenceError:未定义导出

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/43923497/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 04:32:42  来源:igfitidea点击:

Typescript - ReferenceError: exports is not defined

javascripttypescriptwebpack

提问by tholo

In my console I keep getting ReferenceError: exports is not definedas an error.

在我的控制台中,我不断收到ReferenceError: exports is not defined错误消息。

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:

IDetails.ts:

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

tsconfig.json:

tsconfig.json:

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

webpack.config.js:

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

What am I doing wrong here?

我在这里做错了什么?

EDIT: I have edited my question with webpack.config.jsand tsconfig.json. It might also be worthy to notice that I'm viewing the files directly from Webstorm in my Chrome browser. Could that be an issue?

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

Thank you.

谢谢你。

采纳答案by José Quinto Zamora

Try to set "allowJs": false

尝试设置“allowJs”:false

Or to exclude the webpack config file from the typescript compiler using exclude https://www.typescriptlang.org/docs/handbook/tsconfig-json.html

或者使用 exclude https://www.typescriptlang.org/docs/handbook/tsconfig-json.html从打字稿编译器中排除 webpack 配置文件

回答by user3821892

It may be related to your Typescript config options if you're exporting CommonJS modules. You can fix this by running your bundle through a command line utility called Browserify. See http://thejsguy.com/javascript/browserify/2015/01/05/browserify-getting-started.html

如果您要导出 CommonJS 模块,它可能与您的 Typescript 配置选项有关。您可以通过名为 Browserify 的命令行实用程序运行您的包来解决此问题。见http://thejsguy.com/javascript/browserify/2015/01/05/browserify-getting-started.html