0Pricing
JavaScript Academy · 课时

package.json、脚本,以及依赖与 devDeps

理解 package.json 字段,定义简单脚本,并了解依赖与 devDependencies 的区别

package.json、脚本,以及依赖与 devDeps 是 CoddyKit 上的免费 JavaScript Academy 课时。 这是第 1 节课,共 3 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 JavaScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 3 节课。

为什么要有 package.json?

目标:阅读和使用 package.json。

  • 关键字段:name、version、type
  • scripts:运行简短命令
  • dependencies 与 devDependencies 的区别
  • 语义化版本(插入符/波浪号)——入门概览
package.json、脚本,以及依赖与 devDeps — 插图 1

字段一览

package.json 是一个清单,包含项目​​信息、脚本和依赖项列表。

// Emulate a minimal package.json as a JS object
const pkg = {
  name: "hello-app",
  version: "1.0.0",
  type: "module",
  scripts: {
    start: "node index.js",
    build: "echo building...",
    test: "echo tests..."
  },
  dependencies: {
    "chalk": "^5.3.0"
  },
  devDependencies: {
    "eslint": "^9.0.0"
  }
};

console.log("name:", pkg.name);
console.log("version:", pkg.version);
console.log("type:", pkg.type);
console.log("scripts:", Object.keys(pkg.scripts));
package.json、脚本,以及依赖与 devDeps — 插图 2

按名称运行脚本

在 scripts 下添加命令(例如 build、test),然后使用您的软件包管理器运行它们。

// Tiny emulator for "npm run <name>"
function runScript(name) {
  const cmd = pkg.scripts[name];
  if (!cmd) {
    console.log("no such script:", name);
    return;
  }
  console.log("running:", name, "->", cmd);
}

runScript("build");
runScript("test");
runScript("missing");
package.json、脚本,以及依赖与 devDeps — 插图 3

各项应该放在哪里?

应用运行时需要 dependencies;devDependencies 仅包含开发工具。

// List production deps vs development-time tools
function listDeps() {
  console.log("deps:", Object.keys(pkg.dependencies));
  console.log("devDeps:", Object.keys(pkg.devDependencies));
}

// Rule of thumb in comments:
// dependencies -> needed at runtime (your app uses them when running)
// devDependencies -> only for development (lint, test, build tools)

listDeps();
package.json、脚本,以及依赖与 devDeps — 插图 4

语义化版本基础

语义化版本范围表示允许的更新:插入符(次版本号+修订号)、波浪号(修订号)或精确版本。

// Semantic version ranges (intent only)
// ^1.2.3  -> allow minor/patch updates (1.x compatible)
// ~1.2.3  -> allow patch updates (1.2.x)
// 1.2.3   -> exact version

const ranges = ["^1.2.3", "~1.2.3", "1.2.3"];
for (const r of ranges) {
  console.log("range:", r);
}
package.json、脚本,以及依赖与 devDeps — 插图 5

实践提示

提示:

  • 保持脚本简短清晰(例如 build、test)。
  • 运行时库 → dependencies;开发工具 → devDependencies。
  • 先从 ^ 范围开始;如有需要,之后再锁定精确版本。
package.json、脚本,以及依赖与 devDeps — 插图 6

scripts 字段测验

快速检查:命令存放在哪里?

package.json、脚本,以及依赖与 devDeps — 插图 7

回顾

回顾:package.json 列出项目​​信息,使用 scripts 运行任务,并将 dependencies(运行时依赖)与 devDependencies(开发工具)分开。使用简单的语义化版本范围,便于保持更新。

package.json、脚本,以及依赖与 devDeps — 插图 8

常见问题解答

「package.json、脚本,以及依赖与 devDeps」课时是免费的吗?

是的 — 「package.json、脚本,以及依赖与 devDeps」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 JavaScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 3 节课。

「package.json、脚本,以及依赖与 devDeps」这节课中我会学到什么?

理解 package.json 字段,定义简单脚本,并了解依赖与 devDependencies 的区别 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 JavaScript Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 1 节课,共 3 节。

「package.json、脚本,以及依赖与 devDeps」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 JavaScript Academy 课中编写并运行代码吗?

能。每节 JavaScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. package.json、脚本,以及依赖与 devDeps
  2. npx 与语义化版本范围
  3. 本地与全局工具、可执行命令及团队协作流程
← 返回 JavaScript Academy