Angular CLI 6:将库依赖项放在何处 [英] Angular CLI 6: Where to put library dependencies

查看:131
本文介绍了Angular CLI 6:将库依赖项放在何处的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在转换库( ng-app-state )以使用角度cli,现在 v6支持库

I'm converting a library (ng-app-state) to use the angular cli, now that v6 supports libraries (yay!).

在脚手架上复制了一些代码后,这是我的第一个问题:

After scaffolding and copying in some code, here is my first question:

如何/在哪里添加第三方依赖项?

How/where do I add 3rd party dependencies?

package.json projects / ng-app-state / package .json

推荐答案

答案是都是。理解答案来自于此:

Turns out the answer is kind of "both". Understanding the answer comes from this:


  • package.json 在开发过程中。您实际上将所有库安装在这里供您自己使用,包括用户也需要的库。您应该仅在项目的根目录中有一个 node_modules / 目录,而不应该在库目录中(因此只能运行 npm install 和此处类似)。

  • projects / ng-app-state / package.json 将部署到npm(以及在构建过程中添加的一些其他字段)。因此,复制库用户需要的依赖项和/或 peerDependencies 。将 devDependencies 放在这里没有意义。

  • package.json is what will be used during development. You actually install all your libraries here for your own use, including the ones that users will also need. You should only have a node_modules/ directory in the root of your project, not within the library's directory (so only run npm install and similar here).
  • projects/ng-app-state/package.json is what will be deployed to npm (with some additional fields added by the build process). So copy in the dependencies and/or peerDependencies that users of your library will need. There is no point putting devDependencies here.

这是完整的答案。继续阅读以查看示例。

That is the full answer. Read on to see an example.

在我的情况下, package.json 包含很多依赖项 devDependencies (您可以在此处),但所有这些只会影响我(以及希望为 ng-app-state做贡献的任何人)。 projects / ng-app-state / package.json 很小,这就是影响我的图书馆用户的原因:

In my case package.json has a long list of many dependencies and devDependencies (you can see it here), but all of this only effects me (and anyone who wants to contribute to ng-app-state). projects/ng-app-state/package.json is much smaller, and this is what affects users of my library:

{
  "name": "ng-app-state",
  "version": "8.0.0",
  "author": "Simonton Software",
  "license": "MIT",
  "repository": "simontonsoftware/ng-app-state",
  "peerDependencies": {
    "@angular/common": ">=6.0.0 <7.0.0",
    "@angular/core": ">=6.0.0 <7.0.0",
    "@ngrx/store": ">=6.0.0 <7.0.0",
    "micro-dash": ">=3.5.0 <4.0.0"
  }
}

运行 ng后,构建np-app-state --prod 生成要发布到npm的内容,这就是 dist / ng-app-state / (应该发布的内容)的结尾):

After running ng build np-app-state --prod to generate what will be released to npm, this is what ends up in dist/ng-app-state/ (which is what should be published):

{
  "name": "ng-app-state",
  "version": "8.0.0",
  "author": "Simonton Software",
  "license": "MIT",
  "repository": "simontonsoftware/ng-app-state",
  "peerDependencies": {
    "@angular/common": ">=6.0.0 <7.0.0",
    "@angular/core": ">=6.0.0 <7.0.0",
    "@ngrx/store": ">=6.0.0 <7.0.0",
    "micro-dash": ">=3.5.0 <4.0.0"
  },
  "main": "bundles/ng-app-state.umd.js",
  "module": "fesm5/ng-app-state.js",
  "es2015": "fesm2015/ng-app-state.js",
  "esm5": "esm5/ng-app-state.js",
  "esm2015": "esm2015/ng-app-state.js",
  "fesm5": "fesm5/ng-app-state.js",
  "fesm2015": "fesm2015/ng-app-state.js",
  "typings": "ng-app-state.d.ts",
  "metadata": "ng-app-state.metadata.json",
  "sideEffects": false,
  "dependencies": {
    "tslib": "^1.9.0"
  }
}

这篇关于Angular CLI 6:将库依赖项放在何处的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆