angular 2 package.json 文件的说明

Posted 2023-03-07

【中文标题】angular 2 package.json 文件的说明

【英文标题】：Explanation for angular 2 package.json file

【发布时间】：2016-04-15 21:53:00

【问题描述】：

我不愿意使用angular 2 quick start guide 中提供的 typescript 编译器，而是使用 gulp.js。但是，关于 Angular 网站上提供的 package.json 文件，我有几个问题：

  "name": "angular-starter",
  "version": "1.0.0",
  "scripts": 
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  ,
  "license": "ISC",
  "dependencies": 
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  ,
  "devDependencies": 
    "concurrently": "^1.0.0",
    "lite-server": "^1.3.1",
    "typescript": "^1.7.3"
  

我确信像 tsc, tsc:w 脚本命令和 typescript devDependency 这样的东西可以安全地删除，但我不确定像 concurently 依赖和 dependency 部分一般的用途，你们可以吗？提供有关 angular2 之后的所有依赖项的更多信息？我尝试在快速入门指南中沿着附录查找这些内容，但没有运气，因为它们很短。

【问题讨论】：

你在 npmjs.org 上查找过它们吗？

【参考方案1】：

用@nexus23 的回答添加一些要点。我知道我的答案还没有完成，但评论太长了，所以发布为答案希望这对某些人有所帮助。

Package.json 是项目的重要文件，您可以在其中导入您在项目中使用的依赖项列表。 基本上有三种依赖关系

依赖关系 开发依赖 对等依赖 更多文档请参考here in the answers.

现在进入重点，即回答这个问题。为了使我们的 angular2 项目运行，我们必须包含一些依赖项。如下所列。

angular2 -- 是 angular2 项目的基本文件。这是我们项目最重要的文件。 （稳定的最新版本是angular2 beta）

systemjs -- 是通用动态模块加载器——在浏览器和 NodeJS 中加载 ES6 模块、AMD、CommonJS 和全局脚本。适用于 Traceur 和 Babel。 我们使用 systemjs Config 在我们的主文件中设置baseUrl、to Import main file 等，即 index.html，如下所示：

<script> System.config( baseURL: '<%= APP_BASE %>', paths: '*': '*.js?v=<%= VERSION %>', defaultJSExtensions: true ); </script>

【参考方案2】：

concurently 是和 npm 包，它允许一次运行多个 CLI 命令，请参见 package.json 中的以下行。 concurrent 命令来自并发。您可以安全地删除它。

"start": "concurrent \"npm run tsc:w\" \"npm run lite\" "

package.json 文件中的dependency 部分可让您跟踪项目依赖项。在依赖部分中使用这些包的引用允许您使用模块捆绑器，如 webpack、browserify 等。如果新版本引入任何重大更改等，它还会使您的项目链接到每个这些包的特定版本。在 package.json 中包含此部分文件允许您删除包目录（node_modules）以受源代码控制。在假设另一台机器上再次安装这些包只需要 package.json 和 dependency 部分。

对于依赖部分中的每个包，请搜索npmjs 网站以获取更多详细信息。