Question

我正在使用ASP.NET Core中的Angular 2应用程序，我正在尝试将oidc-client（https://github.com/IdentityModel/oidc-client-js）导入到我的一个Typescript文件中。 oidc-client文件是通过bower安装的，它将它们放在预期的bower_components文件夹中。 oidc-client.js文件通过构建的gulp任务复制到wwwroot下的lib文件夹中。

我的目录结构如下所示（仅代表相关部分）：

wwwroot
|
 --app
|  |
|   --shared
|     |
|      --auth
|        |
|         --token.service.ts
 --lib
|  |
|   --oidc-client
|     |
|      --oidc-client.js
|
 --bower_components
|  |
|   --oidc-client
|     |
|      --dist
|     |  |
|     |   --oidc-client.js
|      --oidc-client.d.ts
|
 --typings
   |
    --index.d.ts

我需要在token.service.ts文件中使用oidc-client库，所以我这样做：

import { Oidc } from './lib/oidc-client/oidc-client';

但这会导致错误＆＃39;无法找到模块＆＃39; ./ lib / oidc-client / oidc-client＆＃39;。

我在路径上尝试了不同的变体，相对和非相对，我似乎无法弄清楚如何导入oid-client库。

也许它的打字不起作用？我是否需要对d.ts文件执行任何特殊操作才能使其正常工作？

感谢任何指导。

Answer 1

正如上面的评论所述，使用oidc-client的NPM分布将是首选。

然而，oidc-client中包含的输入有点奇怪。通常，typing .d.ts文件与.js文件并排放置。对于oidc-client，它们位于不同的目录中，这就是导致import语句出现问题的原因。

如果您安装NPM模块并将node_modules/oidc-client/oidc-client.d.ts添加到files的{{1}}配置中：

tsconfig.json

您应该能够创建导入{ "files": [ "index.ts", "node_modules/oidc-client/oidc-client.d.ts" ] }的{{1}}文件：

index.ts

如果oidc-client文件和import { OidcClient } from "oidc-client";文件是并排的，那么您的.d.ts会有效，但它们不是，所以它没有。

如果您不想使用NPM分发，.js和import文件的分离可能也会导致Bower分布问题。

将bower组件库导入Angular 2应用程序

1 个答案: