【问题标题】:Module has not default export after converting to Typescript转换为 Typescript 后模块没有默认导出
【发布时间】:2019-09-16 02:49:53
【问题描述】:

我已将 JavaScript 代码转换为 Typescript 并收到错误消息

模块没有默认导出

我尝试使用花括号导入并使用 module.exports 导出,但都没有成功。

contactController.ts

const contacts: String[] = [];

// Handle index actions
exports.index = (req: any, res: any) => {
    res.json({
        data: contacts,
        message: "Contacts retrieved successfully",
        status: "success"
    });
};

// Handle create contact actions
exports.new = (req: any, res: any) => {

     // save the contact and check for errors
    contacts.push("Pyramids");

    res.json({
            data: contact,
            message: "New contact created!"
        });
};

api-route.ts

import contactController from "./contactController";

在 api-routes.ts 中,当我尝试导入 contactController 模块时,它会抛出错误

模块没有默认导出

如何导入而不出现错误?我曾尝试使用“./contactController”中的“import {contactController}”,但效果不佳。

【问题讨论】:

    标签: javascript typescript express


    【解决方案1】:

    文档(参见“导出”和“导入”部分):Typescript Modules Documentation

    完成 Vasil 的回答:

    当您以这种方式导入模块时:

    // <some_file>.ts
    import <whatever_name_I_want> from "<path_to_my_awesome_module>";
    

    &lt;my_awesome_module&gt;.ts 需要有一个默认导出。例如,可以这样做:

    // <my_awesome_module>.ts
    export default foo = () => { // notice the 'default' keyword
      // ...
    };
    
    export bar = () => {
      // ...
    };
    

    使用上面的代码,&lt;whatever_name_I_want&gt; 将是 foo 方法(一个模块只能有 1 个默认导出)。为了同时导入 bar 方法,您必须单独导入它:

    // <some_file>.ts
    import <whatever_name_I_want>, { bar } from "<path_to_my_awesome_module>";
    

    但根据您的尝试,可能不需要使用默认导出。您可以使用 export 关键字简单地导出所有方法,如下所示:

    // contactController.ts
    export index = (req: any, res: any) => { // no need for a default export
      // ...
    };
    
    export create = (req: any, res: any) => {
      // ...
    };
    

    并将它们都导入括号中:

    // api-routes.ts
    import { index, create } from "./contactController";
    
    // Usage
    index(...);
    create(...);
    

    或在全局变量中:

    // api-routes.ts
    import * as contactController from "./contactController";
    
    // Usage
    contactController.index(...);
    contactController.create(...);
    

    PS:我在 create 中重命名了您的 new 方法,因为“new”已经是 JavaScript 关键字。

    【讨论】:

    • 接受了这个答案,因为它在 Vasil 的答案之上有进一步的解释
    【解决方案2】:

    你需要改变你的导出方式:

    const contacts: String[] = [];
    
    // Handle index actions
    const index = (req: any, res: any) => {
        res.json({
            data: contacts,
            message: "Contacts retrieved successfully",
            status: "success"
        });
    };
    
    // Handle create contact actions
    const newContact = (req: any, res: any) => {
    
         // save the contact and check for errors
        contacts.push("Pyramids");
    
        res.json({
                data: contact,
                message: "New contact created!"
            });
    };
    
    export default {index, newContact};
    

    那么你应该可以像这样导入

    import routes from './contactController';
    

    【讨论】:

    • 或者也可以import * as routes from './contactController'
    猜你喜欢
    • 2016-05-15
    • 2017-10-26
    • 1970-01-01
    • 2021-12-22
    • 2019-12-29
    • 2020-04-30
    • 2021-11-24
    • 2017-03-18
    • 2016-11-11
    相关资源
    最近更新 更多