在Angular-CLI / Webpack项目中发现不真实的“未找到”警告

时间:2016-11-09 18:37:44

标签: angular typescript webpack webpack-dev-server angular-cli

我收到一堆警告,如下所示,事情无法找到,但它们位于正确的位置,我的应用程序运行所以警告必定是错误的。我正在使用webpack版本2.1.0-beta.22和webpack-dev-server 2.1.0-beta.10。我的项目是在GitHub here

你知道我怎么解决这个问题吗?谢谢!

[WDS] Warnings while compiling.
client:73 ./src/app/debate/claim/claim.component.ts
38:55 export 'Claim' was not found in '../../core/store/claim/claim.model'
Error: export 'Claim' was not found in '../../core/store/claim/claim.model'
    at HarmonyImportSpecifierDependency.getWarnings (/Users/Dan/work/bernierebuttals/gba/node_modules/angular-cli/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:34:14)
    at /Users/Dan/work/bernierebuttals/gba/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:645:21
    at Array.forEach (native)
    at /Users/Dan/work/bernierebuttals/gba/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:644:22
    at Array.forEach (native)
    at Compilation.reportDependencyWarnings (/Users/Dan/work/bernierebuttals/gba/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:643:9)
    at Compilation.<anonymous> (/Users/Dan/work/bernierebuttals/gba/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:505:8)
    at Array.forEach (native)
    at Compilation.finish 

Full stack trace

文件结构如下所示:

app
├── core

│   ├── store

│   │   ├── claim
│   │   │   ├── README.md
│   │   │   ├── claim.actions.ts
│   │   │   ├── claim.effects.ts
│   │   │   ├── claim.model.ts
│   │   │   └── claim.reducer.ts

├── debate
│   ├── README.md
│   ├── claim
│   │   ├── claim.component.css
│   │   ├── claim.component.html
│   │   ├── claim.component.spec.ts
│   │   └── claim.component.ts

./src/app/core/store/claim/claim.model.ts

import { Rebuttal } from '../rebuttal/rebuttal.model';

export interface Claim {
...

1 个答案:

答案 0 :(得分:5)

也许这些链接可以解决您的问题:[1][2]

所以我尝试添加一个新文件,仅在界面中导出,警告消失了:

我为claim,claim-rebuttal和rebuttal创建了interfaces文件:

/** /src/app/core/store/claim/claim.interface.ts */
export { Claim } from './claim.model'


/** /src/app/core/store/claim-rebuttal/claim-rebuttal.interface.ts */
export { ClaimRebuttal } from './claim-rebuttal.model'


/** /src/app/core/store/rebuttal/rebuttal.interface.ts */
export { Rebuttal } from './rebuttal.model'

然后我在index.ts

中导出了它
export { Claim } from './claim/claim.interface'
export { Rebuttal } from './rebuttal/rebuttal.interface'
export { ClaimRebuttal } from './claim-rebuttal/claim-rebuttal.interface'

最后,它只是在claim.component和其他文件中更改它:

import { Claim, Rebuttal, ClaimRebuttal }  from '../../core/store';
// ...

@Component({ ...})
export class ClaimComponent {

以及反驳组成部分:

import { Rebuttal, Claim }  from '../../core/store';

@Component({...})
export class RebuttalComponent implements OnInit {
...