Angular2组件相对路径Visual Studio 2015 module.id错误 - 找不到名称'模块'

时间:2016-08-25 21:11:49

标签: angular typescript visual-studio-2015 angular2-template angular2-services

我正在关注模板和样式指南的组件相对路径,可在以下位置找到:

https://angular.io/docs/ts/latest/cookbook/component-relative-paths.html

本指南建议,如果我们将应用程序构建为commonjs模块并使用合适的软件包加载程序(如systemjs)加载这些模块,我们可以指定相对于其组件类文件的模板和样式位置。

我们需要做的就是将组件模板和特定于组件的样式文件作为其伴随组件类文件的兄弟。采用此文件结构约定后,只需通过设置@Component元数据的moduleId属性,就可以指定模板和样式文件相对于组件类文件的位置

@Component({
  moduleId: module.id,
  selector: 'relative-path',
  templateUrl: 'some.component.html',
  styleUrls:  ['some.component.css']
})

我使用的是Visual Studio 2015 TypeScript 2.0 Beta,以下是我的tsconfig文件:

{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": false,
    "target": "es5",
    "outDir": "../content/app/"
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

但是当我尝试编译我的项目时,它不会识别@Component元数据中的module.id并抛出错误:

Severity    Code    Description Project File    Line    Suppression State
Error       Build:Cannot find name 'module'.

有人可以指导如何解决这个问题吗?

2 个答案:

答案 0 :(得分:0)

您可以通过在typings.d.ts文件中包含以下内容来解决此问题,

 declare var module: { id: string };

希望这会有所帮助!!

答案 1 :(得分:0)

之前建议的答案有效: declare var module: { id: string };

没有必要。那和你的tsconfig建议您使用旧配置。几个月前我们停止使用typings支持让npm加载它们。您应该在package.json

中看到类似的内容

"devDependencies": { "@types/angular": "^1.5.16", "@types/angular-animate": "^1.5.5", "@types/angular-cookies": "^1.4.2", "@types/angular-mocks": "^1.5.5", "@types/angular-resource": "^1.5.6", "@types/angular-route": "^1.3.2", "@types/angular-sanitize": "^1.3.3", "@types/jasmine": "~2.5.36", "@types/node": "^6.0.45", ... 了解您使用的是webpack还是systemjs也很重要。如果这是一个问题,我稍后会解释。