十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

Node.js 项目到底是什么:从环境配置到第一个应用实战

Node.js 项目到底是什么:从环境配置到第一个应用实战 “Node.js 项目是什么”这个问题我平时没少被人问过。尤其最近这几年前端项目基本绕不开它人工智能相关的工具链也天天在跟它打交道连带着“nodejs安装及环境配置”“npm报错”“nodejs卸载”这类搜索词的热度一直居高不下。很多人一上来就照着教程装环境装完跑个 hello world 就算完事但对“Node.js 项目”这几个字到底意味着什么心里其实还是模糊的。这篇文章我就用大白话把这事拆明白Node.js 到底是什么一个 Node.js 项目里都有什么环境怎么装、坑怎么避最后再手把手带你把第一个项目跑起来。不管你是前端想补全栈还是刚接触服务端开发的小白只要能照着一步步操作今天之后你再看任何 Node.js 项目应该都不会再发怵了。1. 先说人话Node.js 到底是什么1.1 浏览器之外的 JavaScript 运行时JavaScript 这门语言一开始只能在浏览器里跑因为浏览器内置了解释它的引擎。后来有人把 Chrome 浏览器用的那个 V8 引擎单独拎了出来再配上一些操作系统层面的能力比如读写文件、访问网络、启动子进程打包成了一个可以在电脑上直接运行 JavaScript 的环境——这就是 Node.js。我打个比方浏览器像一家只允许 JavaScript 在“客厅”里活动的公司Node.js 则是直接给 JavaScript 发了一张“全公司工牌”让它不光能进客厅还能去文件档案室、网络通讯部、系统底层车间干活。所以同一个 JavaScript 语法在浏览器里你只能操作网页 DOM在 Node.js 里却可以做服务器、写脚本、处理文件、搭自动化工具。说白了Node.js 就是让 JavaScript 从“网页脚本语言”升级成“通用编程语言”的那个桥梁。1.2 一个 Node.js 项目本质是什么理解了 Node.js 是什么“Node.js 项目”就很好懂了。一个项目本质上就是一个文件夹里面有你的业务代码、配置文件、依赖清单再加上一个描述项目信息的 package.json 文件。你在这个文件夹里通过 Node.js 运行代码它就算一个 Node.js 项目。很多初学者容易把“项目”想得特别神秘觉得是不是必须有一堆高深代码才配叫项目。其实不是。你新建一个文件夹在里面写一个 index.js然后执行node index.js它输出的每个字都算数——这就是一个完整的、最小的 Node.js 项目。真实项目只不过是在这个基础上增加了更多模块、依赖和规范而已。1.3 为什么它这么火Node.js 火的原因我自己的理解是三个字省心、好用、通用。省心在于前后端能用同一种语言前端工程师不用重新学一门后端语言就能写服务端代码好用在于它的包管理工具 npm 里有海量的现成模块你要的功能基本都能找到现成的轮子通用则体现在它覆盖的面实在太广了Web 服务、命令行工具、前端构建工具、桌面应用、物联网脚本全都有它的身影。另外近几年人工智能工具火起来之后很多本地工具、插件、模型调用脚本也选择了 Node.js 作为底座导致身边越来越多非专业程序员也在问“怎么装 Node.js”“怎么配置环境变量”。所以“AI 把 Node.js 带火”这个说法并不夸张——它本来就是生态最完整的运行时之一新工具又源源不断地给它输送用户。2. 一个 Node.js 项目里都有什么2.1 package.json项目的“身份证说明书”package.json 是 Node.js 项目里最重要的文件没有之一。它记录了这个项目的名字、版本、描述、入口文件、脚本命令、依赖列表等信息。你可以把它理解成一张“身份证”加上一份“安装说明书”。比如你打开一个项目的 package.json通常会看到这样几块核心内容。name 是项目名version 是版本号main 字段告诉 Node.js 默认入口文件是哪个scripts 里定义了你能用 npm 跑哪些命令dependencies 和 devDependencies 则分别记录了生产依赖和开发依赖。整个项目的“家底”几乎全在这一个文件里。{ name: my-first-node-project, version: 1.0.0, description: 一个演示用的 Node.js 项目, main: index.js, scripts: { start: node index.js, test: echo \Error: no test specified\ exit 1 }, dependencies: { express: ^4.18.2 }, devDependencies: { nodemon: ^3.0.1 } }新手经常犯的一个错误是手动去改 dependencies 里的版本号然后发现项目跑不起来了。其实依赖变更应该通过 npm 命令来操作比如npm install express会自动帮你把依赖和版本写进 package.json完全不需要手工编辑。2.2 node_modules 和依赖体系当你在项目里执行npm installnpm 会根据 package.json 里的依赖列表把对应的包下载到项目根目录下的 node_modules 文件夹里。这个文件夹的体积往往非常庞大一个稍大点的项目node_modules 动辄几百兆甚至几个 G所以它一般不会提交到代码仓库团队协作时靠 package.json 和 package-lock.json 来还原依赖。package-lock.json 这东西也值得多说一句。它锁定了每个依赖包的精确版本保证你在 A 电脑上装出来的依赖和 B 电脑上完全一致避免“我这能跑你那跑不了”的情况出现。所以看到这个文件不要动它更不要把它删掉。我第一次带团队的时候就被这个文件坑过有人为了让依赖“重新装一遍”把 lock 文件删了结果全组依赖版本全部漂移花了大半天排查问题。2.3 入口文件与启动脚本每个 Node.js 项目都有一个入口文件。你写node index.js就是让 Node.js 从 index.js 开始执行代码。不过为了规范化我们通常会把这条命令写进 package.json 的 scripts 里这样以后启动项目只需要执行npm start就够了。scripts 里比较常见的几条命令是 start、dev、build、test。start 用于正式启动dev 一般用来启动带热重载的开发模式build 用于前端项目的打包构建test 则是跑测试。每一条都可以在 package.json 里自定义你在项目里看别人的 scripts 配置基本就能知道这个项目日常是怎么被操作的了。2.4 常见目录划分虽然 Node.js 项目结构可以很自由但主流项目通常有一套约定俗成的目录规范。比如 src 或 lib 放源代码tests 或tests放测试文件public 或 static 放前端静态资源config 放配置文件docs 放文档。这就像房间虽然可以随便布置但把书放在书架上、衣服放在衣柜里找起来会轻松很多。我建议新手不要纠结“标准结构”到底是什么先把代码写清楚、文件归类合理等接触的项目多了你会自然形成自己的目录习惯。比起结构更重要的是代码逻辑清晰、命名规范这些才是项目可维护性的关键。3. 从零开始环境安装与配置实操3.1 官网下载与版本选择装 Node.js 最稳妥的方式是去它的官网下载安装包。官网上通常提供两个大的版本分支LTS长期支持版和 Current当前最新版。对于绝大多数人直接选 LTS 就好Current 版本尝鲜可以但不建议用在正式项目里因为功能变化快第三方依赖不一定完全兼容。我见过很多新手的困惑明明装的是最新版为什么老项目跑不起来原因往往就是版本太新某些旧依赖还没适配。做开发的常识是生产环境优先用 LTS个人学习用 LTS 也不会错过什么关键功能。Node.js 官网上 LTS 两字下面写了“Recommended for Most Users”这本身就是最直接的选型建议。3.2 Windows 安装与环境变量配置Windows 下安装 Node.js 非常简单下载 .msi 安装包后一路 Next 就行。有个地方要留心安装向导会让你选择“Add to PATH”这个选项一定要勾上。它会把 Node.js 的安装目录写进系统环境变量的 Path 里这样你才能在命令行的任意目录下直接执行node和npm命令。如果在安装时没勾“Add to PATH”或者你前一次装的是绿色解压版那就需要手动配置环境变量。操作路径是右键“此电脑” → 属性 → 高级系统设置 → 环境变量 → 在系统变量里找到 Path → 新建 → 把 Node.js 的安装目录加进去。比如我本机的 Node.js 装在D:\nodejs我就把这个路径加进 Path。配置完记得重启一下命令行窗口否则系统不会立刻加载新环境变量。补充一个验证环境变量的技巧在命令行执行where node如果能看到 Node.js 的安装路径就说明 PATH 配置成功如果提示“找不到文件”那就说明环境变量没配好。这个方法在排查疑难杂症时特别管用。3.3 验证安装是否成功装完之后打开命令行Windows 下是 CMD、PowerShell 或 Windows Terminal输入下面两条命令node -v npm -v如果分别输出了 node 和 npm 的版本号比如 v20.11.0 和 10.2.4说明安装成功。这里额外提醒一句node -v显示的版本号以 v 开头后面的数字越新不代表越适合你LTS 的版本号才是你该关注的。还有一个小操作大家经常忽略npm -v输出版本之后可以顺手执行npm config get registry看看 npm 当前使用的下载源是什么。默认是官方源国内访问偶尔会比较慢这个后面我们细说。3.4 多版本管理与升级日常开发里你很可能遇到“这个项目要 Node 16那个项目要 Node 20”的情况。一个个手动卸载再安装非常折腾所以我强烈建议用版本管理器来处理。Windows 上常用 nvm-windowsmacOS/Linux 上常用 nvm。有了它你可以随时切换 Node.js 版本互不干扰。以 nvm-windows 为例基本操作就三条nvm install 20安装指定版本nvm use 20切换版本nvm list查看当前装了哪些版本。切换完成后再执行node -v就会显示你选中的版本。这个工具完美解决了“Node.js 可以安装多个版本吗”这个问题——当然可以而且应该用工具来管理别自己手动来回折腾。升级 Node.js 也同理用 nvm 安装新版本然后切换过去如果是直接装的安装包那就去官网下载新版本覆盖安装。覆盖安装一般不会影响全局包但为了保险升级前可以用npm ls -g --depth0看看自己装了哪些全局包心里有个数。4. 新手必踩npm 那些坑4.1 npm.ps1 无法加载文件报错这个报错是 Windows 用户的高频问题完整提示一般长这样npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1因为在此系统上禁止运行脚本。第一次遇到的人十有八九会慌以为自己安装坏了其实不是问题出在 PowerShell 的执行策略上。PowerShell 出于安全考虑默认禁止执行未经签名的脚本文件npm.ps1 恰好就是一个脚本文件所以被拦了下来。解决办法有几种第一种最直接在报错提示下面会给你一行建议set-executionpolicy remotesigned -scope currentuser执行它然后输入y确认即可第二种是在 PowerShell 里运行某个项目命令时临时用 CMD 顶替因为 CMD 不存在这个问题第三种是用管理员身份打开 PowerShell执行Set-ExecutionPolicy RemoteSigned同样一劳永逸。我个人的建议是选第一种因为-scope currentuser只影响当前用户不会改动系统级设置安全性更好。改完之后重启命令行npm 命令基本就正常了。4.2 安装时 The installer has encountered 报错这个报错常见于 Windows 安装 .msi 安装包的时候完整信息是The installer has encountered an unexpected error installing this package。它不是一个单一原因导致的报错更像个“万能错误提示”。结合我自己和身边朋友的经验最常见的诱因有三个一是旧版本残留之前装过 Node.js但卸载不干净注册表或文件残留导致新版本装不进去。处理办法是先彻底卸载旧版检查 Program Files 和 AppData 下的 nodejs 相关文件夹确认没有残留再把新版本装一遍。二是杀毒软件误拦截安装程序写文件操作被安全软件拦住了安装进度卡到一半就报错。解决办法是安装时暂时退出安全软件装完再开。三是系统权限不足安装包不是以管理员身份运行的。右键安装包选择“以管理员身份运行”通常能解决不少问题。4.3 npm 镜像源配置npm 默认的官方源在国外国内网络环境下下载依赖时经常卡在npm install那里进度条半天不动。解决办法是换用国内镜像源。最常用的是淘宝源现在的地址是https://registry.npmmirror.com。配置命令非常简单npm config set registry https://registry.npmmirror.com配置完可以执行npm config get registry检查一下看到返回的地址变成镜像源就说明成功了。换源之后依赖下载速度会明显提升。不过有两点要注意一是公司内网的私有依赖包一般不会同步到公共镜像这种场景需要配置公司的私有 registry二是镜像源偶尔会有几小时的同步延迟发布不久的新包可能在镜像上找不到遇到这种情况临时切回官方源装一次就好。4.4 卸载与重装很多人一开始装 Node.js 是瞎装的后面发现自己需要 nvm 做版本管理或者安装目录选得太随意于是想知道“nodejs卸载”到底怎么卸干净。Windows 下最稳的做法是先去“设置 → 应用”找到 Node.js 卸载然后用安装目录清理工具比如 CCleaner 或系统自带的磁盘清理把残留清一清最后手动检查下面这些位置有没有残留文件夹C:\Program Files\nodejsC:\Program Files (x86)\nodejsC:\Users\你的用户名\AppData\Roaming\npmC:\Users\你的用户名\AppData\Roaming\npm-cache把这些地方清理干净再重新安装新版基本不会再遇到奇怪的问题。如果之前用了 nvm还要检查一下 nvm 的安装目录和NVM_HOME、NVM_SYMLINK环境变量把它们一并清理掉。卸载没什么技术含量真正考验人的是“有没有清干净”这决定了你重装后会不会继续踩坑。5. 第一个 Node.js 项目怎么做出来5.1 初始化项目环境装好后找个空目录开始实践。我先建一个文件夹比如叫my-first-node-project命令行进入这个目录然后执行npm init -y-y参数的意思是“别问我了全按默认来”执行完后会自动生成一个 package.json。如果你不用-y它会逐步问你项目名、版本、入口文件、作者等一堆问题新手容易问懵所以我建议第一次用-y快速生成之后再手动修改。生成完 package.json目录是这样的my-first-node-project/ ├── package.json项目空空如也怎么办别急开始写代码。5.2 写一个最简单的 HTTP 服务在项目根目录新建一个index.js内容写上这样几行const http require(http); const server http.createServer((req, res) { res.statusCode 200; res.setHeader(Content-Type, text/plain; charsetutf-8); res.end(你好Node.js 项目); }); const port 3000; server.listen(port, () { console.log(服务已启动请在浏览器访问 http://localhost:${port}); });这段代码做的事很简单用 Node.js 自带的 http 模块创建了一个服务器任何请求进来都返回一句“你好Node.js 项目”。这里用到的require(http)是 Node.js 内置模块不需要额外安装所以这就是一个“零依赖”的 Node.js 项目。很多新手以为写项目必须有一堆依赖才算数其实不是理解原理比盲目上框架更重要。5.3 安装一个依赖并用上它自带的 http 模块已经能满足最基本的服务需求但真实项目里我们通常会引入第三方框架让开发效率更高。学习阶段最值得接触的就是 Express它把请求处理、路由、中间件这些常用功能封装得非常简洁。安装命令是npm install express执行完你会发现两件事项目目录里多了 node_modules 文件夹package.json 里的 dependencies 字段也多出了express: ^4.18.2。接着我们把刚才的 index.js 改成 Express 版本const express require(express); const app express(); app.get(/, (req, res) { res.send(你好Express 项目); }); const port 3000; app.listen(port, () { console.log(服务已启动请在浏览器访问 http://localhost:${port}); });这段代码的逻辑和刚才的 http 版本其实很像创建应用、定义路由、监听端口。但 Express 帮我们省掉了手工设置响应头和状态码的步骤写起来更简洁、更语义化。这也是为什么很多后端项目都用 Express 起步的原因——它能让你专注业务本身而不是纠结底层细节。5.4 启动项目并验证结果在命令行执行node index.js如果看到输出服务已启动请在浏览器访问 http://localhost:3000说明项目已经跑起来了。打开浏览器访问http://localhost:3000页面就会显示“你好Express 项目”这几个字。这里有个小坑要提醒如果端口 3000 被其他程序占了控制台会报EADDRINUSE错误。解决办法是换个端口比如把代码里的3000改成3001或者找到占用端口的进程把它关掉。Window 下可以用netstat -ano | findstr :3000查看谁占用了端口然后到任务管理器里结束对应 PID 的进程。多试几次你对系统的熟悉程度也会跟着涨。6. 搞清楚这些之后Node.js 项目还能往哪走6.1 从脚本到服务端应用跑通第一个 HTTP 服务之后你对 Node.js 项目的理解就已经超过不少人了。接下来建议顺这条线继续往深走学会用模块化把代码拆到不同文件了解什么是请求和响应学习如何连接数据库再研究一下如何在 Express 里做用户登录和权限控制。这一套流程走完你就具备了一个初级后端开发者的核心能力。Node.js 做服务端应用的优势非常明显生态成熟、资料多、招人容易。而且因为和前端同语言很多前端工程师转型全栈的路径就是先学 Node.js。对个人而言能自己一个人写完前端页面再写接口独立搞定一个完整的小网站那种成就感是单纯写页面没法比的。6.2 前端工程化里的 Node.js就算你暂时不想做后端Node.js 在前端领域也是绕不开的存在。现在的 Vue、React 项目构建工具 Vite、Webpack代码检查 ESLint代码格式化 Prettier几乎全部跑在 Node.js 之上。你可以只写前端代码但启动开发服务器、执行构建命令、跑单元测试全都离不开 Node.js 环境。这就是很多非专业用户装了 Node.js 却发现自己天天在用 npm 的原因——它已经成了前端开发的基础设施。理解到这一层“Node.js 项目是什么”这个问题就不再局限于“用 Node.js 写后端”这一件事。它可以是一个静态网站构建工具链可以是一个微信公众号后台服务可以是一个爬虫脚本也可以是一个命令行小工具。项目本身的形式不重要重要的是你拥有了一个通过 JavaScript 和操作系统打交道的入口。6.3 一些小建议给看到这里的朋友几条实在的建议。第一刚开始别追求大而全的框架先把手写 HTTP 服务、理解请求响应流程、掌握模块化这几件事吃透架构和框架都是后面自然会长出来的能力。第二遇到报错先读英文错误提示再复制关键信息去搜索比直接问人收获大得多这也是我见过成长最快的开发者的共同习惯。第三没事多翻翻 package.json 和 node_modules看看常用的包到底依赖了什么你会发现很多“神奇功能”不过是别人封装好的 JavaScript 文件而已。Node.js 这个生态确实还在不断膨胀新工具、新框架层出不穷但它的核心一直没变让 JavaScript 走出浏览器让更多人用同一种语言去构建自己想构建的东西。把这个核心理解了剩下的都是时间问题。最后再分享一个小技巧装完 Node.js 后第一时间在命令行执行npm install -g nrm。这个工具可以让你用一条命令切换 npm 的下载源比手动改配置方便很多。安装后执行nrm ls查看所有可用源执行nrm use taobao切到国内镜像基本就不会再遇到下载依赖卡半天的糟心事了。这些工具和技巧都是我一开始装环境时没人告诉我、靠自己踩坑踩出来的今天一股脑分享给各位希望你们能少走点弯路。
返回列表