【发布时间】:2019-03-26 17:19:50
【问题描述】:
我正在尝试用新的 babel 7 转换我的 angular 6 项目(用 typescript 编写),但我不知道如何让依赖注入工作。
每次在 chrome 中启动项目时都会引发以下错误:
Uncaught Error: Can't resolve all parameters for AppComponent: (?).
at syntaxError (compiler.js:1270)
at CompileMetadataResolver._getDependenciesMetadata (compiler.js:11171)
at CompileMetadataResolver._getTypeMetadata (compiler.js:11064)
at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:10683)
at CompileMetadataResolver._getEntryComponentMetadata (compiler.js:11267)
at eval (compiler.js:10927)
at Array.map (<anonymous>)
at CompileMetadataResolver.getNgModuleMetadata (compiler.js:10927)
at JitCompiler._loadModules (compiler.js:24104)
at JitCompiler._compileModuleAndComponents (compiler.js:24085)
我创建了一个样板的分支并添加了一个简单的 httpClient 服务注入来重现错误: https://github.com/gnihi/angular-6-with-babel-typescript
如果您删除 app.component.ts 中的构造函数,一切正常。
这里是项目依赖:
{
"devDependencies": {
"@babel/core": "^7.1.2",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/plugin-proposal-decorators": "^7.1.2",
"@babel/preset-env": "^7.1.0",
"@babel/preset-typescript": "^7.1.0",
"babel-loader": "^8.0.0",
"babel-plugin-transform-decorators": "^6.24.1",
"webpack": "^4.17.1",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.7"
},
"scripts": {
"build:dev": "webpack --mode development",
"build:prod": "webpack --mode production",
"dev": "webpack-dev-server --mode development --content-base=./dist/",
"type-check": "tsc"
},
"dependencies": {
"@angular/common": "^6.1.6",
"@angular/compiler": "^6.1.6",
"@angular/core": "^6.1.6",
"@angular/platform-browser-dynamic": "^6.1.6",
"@angular/platform-browser": "^6.1.6",
"core-js": "^2.5.7",
"zone.js": "^0.8.26"
}
}
感谢您的宝贵时间和帮助!
【问题讨论】:
-
尝试将
"emitDecoratorMetadata": true,添加到您的 tsconfig.json -
这样不行……
-
该死的是原来的,不是叉子...这是正确的:github.com/gnihi/angular-6-with-babel-typescript
标签: angular typescript webpack dependency-injection babeljs