简体   繁体   English

Typescript和SystemJS无法导入类

[英]Typescript and SystemJS can not import a class

I am a new in Typescript and SystemJS and I started from this simple example, expecting that my ts files will be transpilled on the fly. 我是Typescript和SystemJS的新手,我从这个简单的例子开始,希望我的ts文件能够即时发布。 I created an index.html file. 我创建了一个index.html文件。

<html>
    <head>
        <script src="node_modules/systemjs/dist/system.js"></script>
        <script>
          SystemJS.config({ 
            transpiler: 'typescript',
            map: {
              'typescript': 'node_modules/typescript/lib/typescript.js'
            },
            packages: {
              src: {
                defaultExtension: 'ts'
              }
            } 
          })
          SystemJS.import('src/main').then(function(m){
             console.log(m);
          }, function(error){
             console.log(error);
          });
        </script>
     </head>

     <body>

     </body>
</html>

Then put this two files into src folder. 然后将这两个文件放入src文件夹。

//main.ts

import {Person} from './person';
let person = new Person();
console.log(person.name);


//person.ts

export class Person {
    public name: string = 'David';
} 

And now I don't see anything in my console, no errors no outputs. 现在我在控制台中看不到任何内容,没有错误没有输出。 I've figured out that the problem lays in this line. 我已经发现问题出现在这一行。

import {Person} from './person';

Because if I comment it I will see this reasonable error. 因为如果我评论它,我会看到这个合理的错误。

Error: Invalid or unexpected token 错误:无效或意外的令牌

Help me please where should I pay my attention to? 请帮助我,我应该在哪里注意?

Did not you miss the script tag to typescript? 你没有错过打字稿的脚本标签吗?

<script src="node_modules/typescript/lib/typescript.js"></script>

I believe this is the source you have used as sample. 我相信是你用作样本的来源。 They explicitly mention this kind of error. 他们明确提到了这种错误。

Thank you for the link. 谢谢你的链接。 I added and configured a plugin-typescript in this way and it started to work fine. 我以这种方式添加并配置了一个plugin-typescript,它开始工作正常。

      SystemJS.config({ 
        transpiler: 'ts',
        map: {
          'typescript': 'node_modules/typescript/lib',
          'ts': 'node_modules/plugin-typescript/lib/plugin.js'
        },
      packages: {
        "typescript": {
          "main": "typescript.js",
          "meta": {
            "typescript.js": {
              "exports": "ts"
            }
          }
        }
      }
      })

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM