什么是 angular2-library-hostetler？
angular2-library-hostetler 是一个基于 Angular2 库开发的 npm 包，它可以帮助开发人员创建可重用的组件，并将它们打包为一个可独立运行的库。此外，它还允许开发人员将这些组件发布到 npm，以供其他开发人员使用。
如何安装 angular2-library-hostetler？
如果你已经安装了 Angular CLI，那么你可以直接使用以下命令来安装 angular2-library-hostetler：
npm install angular2-library-hostetler --save-dev
如果你还没有安装 Angular CLI，可以使用以下命令安装：
npm install -g @angular/cli
如何使用 angular2-library-hostetler？
安装完成后，你可以在 Angular 项目中使用 angular2-library-hostetler 提供的命令来创建和打包库：
创建一个新库
使用以下命令创建一个名为 my-library 的新库：
ng g library my-library
命令执行完成后，你会发现在你的项目根目录下会多出一个名为 projects 的文件夹，里面包含了一个名为 my-library 的文件夹，这就是我们刚才创建的库。
打包库
使用以下命令将库打包成一个可独立运行的文件：
ng build my-library
命令执行完成后，你可以在项目根目录下的 dist 文件夹中找到一个名为 my-library 的目录，里面包含了我们刚才打包的库。
发布库到 npm
将库发布到 npm 上可以使其他开发人员能够使用它，使用以下命令发布库：
cd dist/my-library npm publish
命令执行完成后，你就可以在 https://www.npmjs.com 上找到你的库了。
如何在 angular2-library-hostetler 中创建和使用组件？
在 my-library 中，你可以使用以下命令来创建一个组件：
ng g component my-component --project=my-library
命令执行完成后，你会在 my-library/src/lib 中看到一个名为 my-component 的文件夹，里面包含了我们刚才创建的组件。
在 my-component.component.ts 文件中，你可以编写组件的逻辑代码，如下所示：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------------
--------- -------------------
--------- -
---
------------ ------
----
--
------- --
--
------ ----- -------------------- --此时，我们的组件就已经创建好了。接下来，我们就可以在应用程序中使用它了。
在我们的应用程序中，你需要在 app.module.ts 文件中将 my-library 引入：
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - --------------- - ---- -------------
-----------
-------- -
---------------
--
------------- -
-- ------------
--
---------- -
-- ---------
-
--
------ ----- --------- - -接下来，你需要在 app.component.html 文件中使用我们的组件：
<lib-my-component></lib-my-component>
这样，我们就可以在我们的应用程序中使用刚才创建的组件了。
总结
通过本文，我们了解了如何使用 angular2-library-hostetler 创建和打包可重用的组件，并将它们发布到 npm 上供其他开发人员使用。同时，我们还学习了如何在应用程序中使用这些组件。希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005591981e8991b448d68bb