首页 文章

如何在TypeScript中正确导出和导入模块

提问于
浏览
4

Note: 我知道有很多关于这个主题的帖子,我已经回顾了很多已经没有成功的帖子(请参阅本文底部的参考资料) .

我正在尝试使用Visual Studio Code在TypeScript中运行一个非常简单的测试,我在一个文件中声明一个类并将其导入另一个文件 . 但是,我继续遇到一个问题,我导入的文件无法识别从其他文件导出的类的方法 .

我此时收到的确切错误消息是:

[ts]属性'getFirstName'在类型'typeof“module-test / src / OtherClass”'上不存在 . [ts]属性'getLastName'在类型'typeof“module-test / src / OtherClass”'上不存在 .

我正在使用Node 9.3.0和TypeScript 2.6.2 .

非常感谢任何人可以提供给我的任何指导!

main.ts

import * as Other from "./OtherClass";

class myApp
{
  public async start()
  {
    console.log("Starting application");
    
    try
    {
      let firstName = await Other.getFirstName();
      console.log("First Name: " + firstName);
      let lastName = await Other.getLastName();
      console.log("Last Name: " + lastName);
    }
    catch (error)
    {
      console.error("Unable to get name: " + error)
    }
    
    console.log("Ending application");
  }
}

const app = new myApp();
app.start();

OtherClass.ts

class Other
{
  getFirstName(): string
  {
    return "John";
  }

  getLastName(): string
  {
    return "Doe";
  }
}

export { Other };

Things I've Tried

  • 通过声明导出
export class Other
{
  getFirstName(): string
  {
    return "John";
  }

  getLastName(): string
  {
    return "Doe";
  }
}
  • 导出各个功能
class Other
{
  export function getFirstName(): string
  {
    return "John";
  }

  export function getLastName(): string
  {
    return "Doe";
  }
}
  • 多个导出语句
module.exports = Other;
export { Other };
export * from "OtherClass";
  • 多个导入语句
import * as Other from "./OtherClass";
import { Other } from "./OtherClass";

Configuration Files package.json

{
  "name": "module-test",
  "version": "1.0.0",
  "description": "Simple test of exporting and importing modules",
  "main": "./lib/main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "John Doe",
  "license": "ISC",
  "dependencies": {
    "typescript": "^2.6.2"
  },
  "devDependencies": {
    "@types/node": "^8.5.2",
    "@types/typescript": "^2.0.0"
  }
}

tsconfig.json

{
  "compilerOptions": {
    /* Basic Options */
    "target": "es2016",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "outDir": "./lib/",                        /* Redirect output structure to the directory. */
    "strict": true,                            /* Enable all strict type-checking options. */
    "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
    "inlineSources": true                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
  }
}

Articles Referenced

1 回答

  • 5

    从哪里开始?这是一个远离有效程序的许多编辑;你应该从一个有用的例子开始,因为它不是100%清楚你想要这个代码做什么 .

    您创建了一个具有单个命名导出的模块,类为 Other .

    export { Other };
    

    然后导入周围的模块对象:

    import * as Other from "./OtherClass";
    

    在导入文件中,该类现在具有名称 Other.Other . 但是在代码中没有任何一点你实际上用 new 实例化了这个类!所以在这里

    let firstName = await Other.getFirstName();
    

    你需要写

    const oth = new Other.Other();
    

    当然,这看起来很愚蠢 . Change import语句(没有多个!)来

    import { Other } from "./OtherClass";
    

    而现在你可以写

    const oth = new Other();
    

    继续,我们写

    let firstName = await oth.getFirstName();
    

    除了 getFirstName 不是异步函数,所以你应该写

    let firstName = oth.getFirstName();
    

相关问题