使用组件库部署 Angular 6 个应用
Deploy Angular 6 app with component library
我构建了一个 Angular 6 应用程序,该应用程序包含一个包含将来应重复使用的组件的库和一个应用程序。我使用 angular cli 创建了所有内容,因此我具有默认结构
my-app
|
+-projects
| |
| +-my-lib
| |
| +-src
| +-package.json
|
+-src
+-package.json
为了构建项目,我首先使用 ng build my-lib --prod
构建库,然后使用 ng build --prod
构建应用程序。之后 dist 目录看起来像这样
dist
|
+-my-app
+-my-lib
我现在的问题是如何将它部署到我的服务器,以便该应用程序可以访问该库。在本地一切正常,所以我应该像往常一样将整个 dist
目录传输到我的服务器吗?
或者我应该将库发布到 npm 并将其作为常规依赖项添加到我的 package.json
。
如果是,我如何设置它以不干扰本地开发,我想在 dist 目录中构建库?
您的 my-app
构建已经包含 my-lib
库,因此只需部署 dist/my-app
.
至于发布到 npm 完全取决于您。
对于本地开发,您可以考虑使用 npm link
:
- cd dist/my-lib
- npm link
- cd to/your/project/dir
- npm link 你的库名(可能是
my-lib
)
当您更改库并重新构建时,无需重做link,它将获取新版本。
但是根据我的经验,当您更新或安装其他 "regular" 软件包时,您必须再次执行 link。
我构建了一个 Angular 6 应用程序,该应用程序包含一个包含将来应重复使用的组件的库和一个应用程序。我使用 angular cli 创建了所有内容,因此我具有默认结构
my-app
|
+-projects
| |
| +-my-lib
| |
| +-src
| +-package.json
|
+-src
+-package.json
为了构建项目,我首先使用 ng build my-lib --prod
构建库,然后使用 ng build --prod
构建应用程序。之后 dist 目录看起来像这样
dist
|
+-my-app
+-my-lib
我现在的问题是如何将它部署到我的服务器,以便该应用程序可以访问该库。在本地一切正常,所以我应该像往常一样将整个 dist
目录传输到我的服务器吗?
或者我应该将库发布到 npm 并将其作为常规依赖项添加到我的 package.json
。
如果是,我如何设置它以不干扰本地开发,我想在 dist 目录中构建库?
您的 my-app
构建已经包含 my-lib
库,因此只需部署 dist/my-app
.
至于发布到 npm 完全取决于您。
对于本地开发,您可以考虑使用 npm link
:
- cd dist/my-lib
- npm link
- cd to/your/project/dir
- npm link 你的库名(可能是
my-lib
)
当您更改库并重新构建时,无需重做link,它将获取新版本。
但是根据我的经验,当您更新或安装其他 "regular" 软件包时,您必须再次执行 link。