如何在 WebStorm 中发布可自动导入的 npm 模块？

Question

我尝试发布一个简单的模块，如下所示：

文件列表是：

|--[src]
|    |--[share]
|          |--share.moduel.ts
|          |--index.ts
|
|
|--package.json
|--index.ts

package.json

{
  "name": "my-common",
  "version": "1.0.0",
  "description": "",
  "main": "index.ts",
  "typings": "index.ts",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

index.ts

export { ShareModule } from './src/share/index';

src/share.module.ts

import {NgModule} from "@angular/core";
import {CommonModule} from "@angular/common";
import {FormsModule} from "@angular/forms";

@NgModule({
  imports: [
    CommonModule,
    FormsModule
  ],
  declarations: [],
  exports: [CommonModule,FormsModule]
})
export class ShareModule { }

src/index.ts

export { ShareModule } from './share.module';

发布 npm 模块后，然后 npm install my-common，我尝试在代码 'ShareModule' 上按 Alt + Enter 以自动组织导入声明，但它不显示选项卡“Add import statement”，其工作方式类似于 Angular2 HttpModulem、FormModule 等

那么我怎样才能使自己的模块像其他 Angular2 的官方模块一样在 WebStorm 中通过按键 Alt + Enter 自动导入？我有没有漏掉一些关键点？

Answer 1

终于，我找到了让它工作的方法。

第一步在您的 **/src/** 文件夹中创建两个文件，如下所示：

index.d.ts index.ts

步骤 2 编辑你的 index.d.ts 你显示导出 class 你想使用 Alt + Enter 导入 WebStrom

例如

export declare class ShareModule {
}

步骤 3 编辑您的 index.ts，如下所示：

export {ShareModule} from './share/share.module';

步骤 4 在 / 文件夹中创建两个文件，如下所示

index.ts:

export * from './src/index';

index.d.ts：

export * from './src/index'

最后，文件应该如下：


    |--[src]
    |    |--[share]
    |    |      |--share.moduel.ts
    |    |--index.ts
    |    |--index.d.ts
    |
    |
    |--package.json
    |--index.ts
    |--index.d.ts

现在您可以通过 Alt + Enter

导入您的 class

如何在 WebStorm 中发布可自动导入的 npm 模块？

How to publish a npm module that can be auto import in WebStorm?

node.js

npm

webstorm

angular