错误的打包库 - Angular 自定义库 - NPM

Question

我正在学习将一个简单的 Angular 库发布到 NPM。我遵循了许多不同的教程（例如 here or here or here）并在 NPM 上获得了包。但是，当我尝试在测试项目中使用它时，它总是会抛出错误。

我做了什么

TL;DR：您可以从 github and npm.

中找到我试图制作的内容

我按照文档中的概述创建了新的 angular 项目：

ng new angularx-wrapper-workspace --create-application=false
cd angularx-wrapper-workspace
ng generate library angularx-wrapper

我的文件夹结构如下：

我开发库，简单来说，这些是核心文件：

//public-api.ts
export * from './lib/angularx-wrapper.module';
export * from './lib/angularx-wrapper.component';

//angularx-wrapper.module.ts
import { NgModule } from '@angular/core';
import { AngularXWrapperComponent } from './angularx-wrapper.component';
import { CommonModule } from '@angular/common';

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

(貌似是npm打包过程中的错误，所以省略不相关的细节)

我构建了用于发布的库：

ng build angularx-wrapper --prod

我发布库：

npm publish

库发布成功。但是，当我创建一个新的测试应用程序以查看它是否有效时（test 应用程序完全不同并且不在库文件夹中）：

ng new test
cd test
npm install angularx-wrapper

问题

发生了两件事。第一件事是我无法将库导入我的测试应用程序：

导入它的唯一方法是这样做：

即使在成功将库导入我的测试应用程序后，运行它还是产生了这个错误：

ERROR in ./node_modules/angularx-wrapper/src/lib/angularx-wrapper.component.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: /code/user/test/node_modules/angularx-wrapper/src/lib/angularx-wrapper.component.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format.
    at AngularCompilerPlugin.getCompiledFile (/code/user/code/user/test/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:933:23)
    at /code/afunworm/code/user/test/node_modules/@ngtools/webpack/src/loader.js:41:31
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
ERROR in ./node_modules/angularx-wrapper/src/lib/angularx-wrapper.module.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: /code/user/code/user/test/node_modules/angularx-wrapper/src/lib/angularx-wrapper.module.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format.
    at AngularCompilerPlugin.getCompiledFile (/code/user/code/user/test/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:933:23)
    at /code/user/code/user/test/node_modules/@ngtools/webpack/src/loader.js:41:31
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

我哪一步做错了？是我的库的文件夹结构导致了问题吗？我似乎找不到有关如何解决此问题的任何资源。

Answer 1

我发现了问题。问题是您必须运行 npm publish 从 dist 文件夹，而不是库文件夹本身。这是一个相当愚蠢的错误，但没有专门针对该错误的文档，所以我想我会在这里留下答案。

错误的打包库 - Angular 自定义库 - NPM

Bad packaged library - Angular custom library - NPM

npm

typescript

angular

angular-library

我做了什么

问题