4

当我将模块导入另一个项目时，我有一个 Angular 库项目，我收到一个错误提示：pipesModule在vs代码Unable to resolve signature for pipe invocation中，它仍然有效，构建没有错误，但我不知道如何修复它，我得到了这么多红线...

现在，升级后错误提示发生了变化，如下所示： Unable to resolve signature for call of pipeName，但我认为这意味着同样的事情

每个管道都会出现这个错误，我受不了红线...，但是可以通过webstorm解决。

错误提示截图

仅此而已，有什么问题？

角库项目

Angular Library Project
├─src
│  ├─pipes
│  │  ├─hide-tel.pipe.ts
│  │  ├─pipes.module.ts
│  │  └─index.ts
│  ├─public_api.ts
...
  • 隐藏电话.pipe.ts
import {Pipe, PipeTransform} from '@angular/core';

@Pipe({
  name: 'hideTel'
})
export class HideTelPipe implements PipeTransform {
  transform(value: string): string {
    return value.slice(0, 3) + '****' + value.slice(-4);
  }
}
  • 管道模块.ts
import { NgModule } from '@angular/core';
import { HideTelPipe } from './hide-txt.pipe';

const PIPES = [
  HideTelPipe,
];

@NgModule({
  declarations: [ ...PIPES ],
  exports: [ ...PIPES ],
})
export class PipesModule {}
  • 索引.ts
export * from './hide-tel.pipe';
export * from './pipes.module';
  • public_api.ts
export * from './pipes/index';

问题项目

Question Project
├─src
│  ├─my-common
│  │  └─my-common.module.ts
│  ├─app
│  │  └─some
│  │     ├─some.component.html
│  │     ├─some.component.scss
│  │     └─some.component.ts
│  ├─app.module.ts
...
  • 我的common.module.ts
import {ModuleWithProviders, NgModule} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {CommonModule} from '@angular/common';

const MODULES = [
  CommonModule,
  FormsModule,
  PipesModule,
];

@NgModule({
  imports: [
    ...MODULES,
  ],
  declarations: [],
  exports: [
    ...MODULES,
  ],
  providers: [],
})
export class MyCommonModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: MyCommonModule,
      providers: [],
    };
  }
}
  • app.module.ts
import {BrowserModule} from '@angular/platform-browser';
import {ErrorHandler, NgModule} from '@angular/core';
import {RouterModule} from '@angular/router';
import {AppComponent} from './app.component';
import {TransferHttpCacheModule} from '@nguniversal/common';
import {HttpClientModule} from '@angular/common/http';
import {CommonModule} from '@angular/common';
import {FormsModule} from '@angular/forms';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {environment} from '../environments/environment';
import {APP_ROUTES} from './app.routing';
import {MyCommonModule} from './my-common/my-common.module';

import {SomeComponent} from './app/some/some.component.ts';

@NgModule({
  declarations: [
    AppComponent,
    SomeComponent,
  ],
  imports: [
    CommonModule,
    FormsModule,
    BrowserAnimationsModule,
    MyCommonModule.forRoot(),
    BrowserModule.withServerTransition({appId: 'my-app'}),
    RouterModule.forRoot(APP_ROUTES, {
      useHash: false
    }),
    TransferHttpCacheModule,
    HttpClientModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
}
  • some.component.html
<div>{{ telNumber | hideTel }}</div>
       〰️〰️〰️〰️〰️〰️〰️〰️〰️
=======^================================================
  x some.component.html 1 of 1 problems
--------------------------------------------------------
  Unable to resolve signature for call of hideTelng
========================================================
4

1 回答 1

3

可以通过"preserveSymlinks": truetsconfig.json 中的选项来解决

  • tsconfig.json
{
    ...
    "compilerOptions": {
        ...
        "preserveSymlinks": true,
    },
}
于 2020-04-23T01:58:00.640 回答