Question

我有.js文件，并希望集成一些我们拥有的.ts文件。当我尝试导入它们时，出现一些奇怪的错误。

这是我的.js文件中的导入文件：

import {AuthComponent} from './auth/auth.component';

.ts文件（auth.component.ts）：

import {Component, OnInit} from '@angular/core';
import {ActivatedRoute, Params, Router} from '@angular/router';
import {UserService} from '../user/user.service'; //also a .ts file

@Component({
  selector: 'app-auth',
  templateUrl: './auth.component.html',
  styleUrls: ['./auth.component.scss']
})

export class AuthComponent implements OnInit {
  loadingConfig: any = {
    fullScreenBackdrop: true,
    backdropBackgroundColour: 'rgba(0,0,0,0.9)',
    primaryColour: '#b8860b'
  };
};

当我尝试编译应用程序时，我得到以下信息

Error in ./app/auth/auth.component.ts Module parse failed: /data/1/projects/myapp/src/app/auth/auth.component.ts Unexpected character '@' (7:0) You may need an appropriate loader to handle this file type.

第7行是@Component

在我的webpack.config.js中，我添加了：

resolve: {
   extensions: ['.ts', '.js','.json']
}

我还在tsconfig.json的根目录中创建了一个app，它具有：

"compilerOptions": {
  "target": "es6",
  "module": "commonjs",
  "allowJs": true,
  "checkJs": true
}

我猜我可以将.ts文件导入.js文件...但是也许我遗漏了一些东西？谢谢大家！

Answer 1

这是绝对正常的，Javascript不知道什么是Typescript。您的错误发生了装饰器的cuz，而装饰器尚未在JS中实现。

将.ts文件导入.js文件时出错

1 个答案: