【问题标题】:Cannot find imported Module TypeScript找不到导入的模块 TypeScript
【发布时间】:2015-10-21 16:05:50
【问题描述】:

我正在尝试在 VS 2015 中设置新的 TypeScript HTML 项目。我已将 typescript 构建设置设置为 commonJses5 以及有 tsconfig.json,即

   {
 "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "sourceMap": true
   }
}

这是我的主要 app.ts

  import t = require('./test');

class Greeter {
element: HTMLElement;
span: HTMLElement;
timerToken: number;
t: any;

constructor(element: HTMLElement) {
    this.element = element;
    this.element.innerHTML += "The time is: ";
    this.span = document.createElement('span');
    this.element.appendChild(this.span);
    this.span.innerText = new Date().toUTCString();
    this.t = new t.sample.test();
}

start() {
    this.timerToken = setInterval(() => this.span.innerHTML = new Date().toUTCString(), 500);
    this.t.hello();
}

stop() {
    clearTimeout(this.timerToken);
  }

 }

 window.onload = () => {
  var el = document.getElementById('content');
   var greeter = new Greeter(el);
   greeter.start();
};

这是我导入的模块 test.ts

   export module sample {
export class test {
    constructor() { }
    hello = () => {

        console.log("Test");
    }
  }
 }

这里是html。

    <!DOCTYPE html>

    <html lang="en">
    <head>
     <meta charset="utf-8" />
      <title>TypeScript HTML App</title>
   <link rel="stylesheet" href="app.css" type="text/css" />
  <script src="test.js"></script>
  <script src="app.js"></script>


    </head>
   <body>
    <h1>TypeScript HTML App</h1>
   <div id="content"></div>
   </body>
   </html>

该项目构建良好,但是当我在浏览器 chrome 或 IE 中打开它时,它会在控制台中引发错误,它无法找到 test 并且该文件永远不会下载到浏览器中。任何人都可以建议我在这里缺少什么。

【问题讨论】:

    标签: typescript


    【解决方案1】:

    这是我推荐的修复方法...

    第一步 - 为 AMD(或 UMD)而不是 CommonJS 编译:

    "module": "amd",
    

    第二步 - 在此处放弃内部模块:

      export module sample {
    

    第三步 - 添加 RequireJS(作为 NuGet 包提供)

    第四步 - 使用 Require JS

    <script src="require.js" data-main"app"></script>
    

    【讨论】:

      猜你喜欢
      • 2023-04-02
      • 1970-01-01
      • 2016-07-05
      • 2017-03-15
      • 2015-11-10
      • 2019-05-25
      • 2019-03-16
      • 1970-01-01
      • 2018-04-23
      相关资源
      最近更新 更多