使用组件库部署 Angular 6 应用程序

use*_*433 1 angular angular6 angular-cli-v6

我构建了一个 Angular 6 应用程序,其中包含一个包含将来应重用的组件的库和一个应用程序。我使用 Angular cli 创建了所有内容,所以我有默认的结构

my-app
 |
 +-projects
 |   |
 |   +-my-lib
 |      |
 |      +-src
 |      +-package.json
 |
 +-src
 +-package.json
Run Code Online (Sandbox Code Playgroud)

为了构建项目,我首先使用构建库ng build my-lib --prod,然后使用 构建应用程序ng build --prod。之后 dist 目录看起来像这样

dist
 |
 +-my-app
 +-my-lib
Run Code Online (Sandbox Code Playgroud)

我现在的问题是如何将其部署到我的服务器,以便应用程序可以访问该库。在本地一切正常,所以我应该像往常一样将整个dist目录传输到我的服务器吗?或者我应该将库发布到 npm 并将其添加为我的package.json. 如果是,我如何设置它才能不干扰本地开发,我想在 dist 目录中构建库?

PeS*_*PeS 5

您的my-app构建已经包含my-lib库,因此仅部署dist/my-app.

至于发布到 npm 这完全取决于你。

对于本地开发,您可以考虑使用npm link

  1. cd dist/my-lib
  2. npm 链接
  3. cd 到/你的/项目/目录
  4. npm 链接 your-library-name (可能my-lib

当您更改库并再次构建时,无需重做链接,它将获取新版本。

但是,根据我的经验,当您更新或安装其他“常规”软件包时,您必须再次进行链接。

  • 那太好了。我将尝试部署应用程序本身。最新的 Angular cli 版本不需要“npm link”。将 lib 作为库添加到“angular.json”足以构建整个项目 (2认同)