尝试NPM使用Angular-CLI发布和安装自定义angular2组件;只编译第一次

时间:2017-04-07 15:57:10

标签: angularjs angular npm angular-cli npm-install

我有一个最不寻常和令人沮丧的问题。

我有一个名为 via-date-picker 的Ng2组件,我正在尝试NPM发布,以便它可以在其他项目中轻松使用。为了做到这一点,我把它变成了一个Angular2组件库。 via-date-picker导出一个名为 ViaDatePickerModule 的模块,我想在其他地方导入。

为了测试并确保它正确发布,我正在进行NPM安装并将其导入一个空的Angular-CLI项目,我称之为 npm-test

所以我使用" ng serve"运行我的npm-test应用程序,我收到此错误:

  

ViaDatePickerModule中的错误不是NgModule   webpack:无法编译

尽管有这样的错误,项目还是会编译:

Has error, but compiles anyway

当我打开我的项目时,请注意,一切正常!

但这只发生在我运行项目的第一次时间。在通过" ng serve"连续尝试运行项目时,我得到了相同的编译错误,但这次项目只是完全拒绝完成它的编译:

enter image description here

我不知道为什么我会收到此错误,以及为什么Angular-CLI有时会运行我的项目而不会运行其他项目。

我已经在网上搜索了答案,并尝试了我能找到的每个解决方案,以及我能想到的所有其他事情:

  • 我尝试调整组件库中的tsConfig设置
  • 我尝试使用rollup.js代替gulp.js来构建我的组件库
  • 我尝试过复制现有的工作组件库,然后仔细更换我自己的现有代码
  • 我降级了Angular CLI
  • 我已升级Angular CLI
  • 我已降级打字稿
  • 我已经升级了Typescript
  • 我已多次删除并重新安装node_modules
  • 我已经删除并重新启动了整个项目两次

无论我做什么,我都会遇到上面发布的同一个webpack错误; ViaDatePickerModule不是NgModule。我完全没有想法。任何人都可以提供的帮助将是疯狂的帮助。

为了彻底彻底,我创建了一个包含所有文件的公共repo on github here,分为两个主目录:

  • COMPONENT_BEFORE_PUBLISHING:包含我正在运行的组件库" npm publish"
  • WHAT_IS_IMPORTED_INTO_NODE_MODULES:包含导入到我的npm-test项目的node_modules目录中的结果目录

同样,任何人都可以提供的帮助将非常非常感谢!真的,我会永远感激。

1 个答案:

答案 0 :(得分:1)

如果您确定所有消费者都会从TS项目(例如angular-cli)导入您的组件,模块......等。您可以直接发布TS来源而无需进行转换。 IE浏览器。您将发布可以在任何项目中导入的静态.ts文件,这些文件将为您进行转换。

但是,如果您希望自己的库也被用作JS es5es6模块,那么应该 transile。

另外,您可以尝试角度编译器ngc而不是typescript编译器tscngctsc的包装器。你可以从那里开始,那里有很多库启动器可以帮助你启动一个角度库并使其针对AOT编译进行优化。