当前位置:

首页 > 编程开发 > ubuntu如何搭建js开发平台

ubuntu如何搭建js开发平台

在Ubuntu搭建JavaScript开发环境,需先安装Node.js与npm(可用APT、NodeSource或NVM),推荐NVM管理多版本。编辑器建议VSCode并安装ESLint等扩展。项目用npminit初始化,运行Express服务测试。注意权限与镜像源配置。

在 Ubuntu 上搭建 Ja vaScript 开发环境,其实比想象中要简单得多。很多人一开始被终端命令吓住,但梳理清楚核心步骤之后,你会发现整个过程相当顺滑。下面我们就从最关键的 Node.js 与 npm 开始,一步步把环境搭起来。

ubuntu如何搭建js开发平台

一、安装 Node.js 与 npm

先把系统包索引更新一下,然后安装基础包:sudo apt update && sudo apt install -y nodejs npm。安装完成后用 node -v 和 npm -v 验证,能看到版本号就算成功了。

不过,这里有个选择问题。APT 默认仓库里的 Node.js 版本可能偏旧,适合入门或者保守环境。如果你需要特定版本或最新特性,有三种主流方式可以选:

NodeSource 二进制分发——适合需要指定版本的场景。比如安装 18.x 版本,先运行 curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -,然后 sudo apt install -y nodejs 即可。

NVM(Node Version Manager)——这是开发场景下的推荐方案。它允许你在一台机器上同时安装多个 Node.js 版本,并按项目随时切换。安装 nvm 的命令是 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash,然后执行 source ~/.bashrc 加载。之后你可以用 nvm install node 安装最新版,或者 nvm install --lts 安装长期支持版,切换版本则用 nvm use <版本号> 或 nvm use --lts。

不管你用哪种方式,安装完毕后再次用 node -v 和 npm -v 确认一下版本,确保一切正常。

二、选择与配置编辑器

编辑器方面,Visual Studio Code 是大多数人的首选。在终端直接 sudo apt update && sudo apt install -y code 就能装好,然后在项目目录里运行 code . 即可打开。如果你偏好其他工具,Sublime Text 也支持通过 PPA 安装:sudo add-apt-repository ppa:webupd8team/sublime-text-3 && sudo apt update && sudo apt install -y sublime-text-installer。

编辑器装好之后,建议安装几个常用扩展,能让开发体验提升不少:ESLint(代码规范检查)、Prettier(自动格式化)、Node.js Modules Intellisense(模块智能提示)、Debugger for Chrome/Firefox(浏览器调试)。这些在 VS Code 的扩展市场里都能直接搜到。

三、创建项目与运行示例

先建个项目目录并初始化:mkdir my-js-project && cd my-js-project,然后 npm init -y 会生成一个 package.json 文件。接下来创建一个简单的入口文件:echo 'console.log("Hello, Ubuntu JS");' > index.js,再运行 node index.js,你应该能看到终端输出那句话。

如果你想试试更实际的服务端场景,可以快速搭一个 Express 服务。先安装依赖 npm install express,然后创建 app.js 文件,内容如下:

const express = require('express'); const app = express(); app.get('/', (req, res) => res.send('Hello, world!')); app.listen(3000, () => console.log('Server on http://localhost:3000'));

保存后执行 node app.js,在浏览器访问 http://localhost:3000,就能看到“Hello, world!”了。

四、常用工具与最佳实践

全局工具方面,如果你需要构建和转译代码,可以安装 Webpack、Babel 等:npm install -g webpack webpack-cli babel-cli @babel/core @babel/preset-env。不过要注意,全局安装有时会引发权限问题,后面会提到怎么处理。

版本管理上,生产环境建议使用 LTS 版本:nvm install --lts。升级 npm 则用 sudo npm install -g npm@latest。另外,有些 npm 包需要本地编译,所以提前安装 sudo apt-get install -y build-essential 可以避免很多麻烦。

最后说几个常见问题的解决办法:

  • 权限问题:如果不想每次全局安装都用 sudo,可以修改 npm 目录的所有权:sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share}。
  • 网络问题:切换镜像源能加速下载,比如 npm config set registry https://registry.npm.taobao.org。
  • 版本冲突:用 nvm 隔离不同项目的 Node 版本是最干净的方案,记得在项目根目录创建 .nvmrc 文件指定版本,团队协作时特别有用。

到这里,一个完整的 Ja vaScript 开发环境就搭建好了。从编辑器到包管理器,从简单脚本到 Express 服务,所有基础都在上面了。接下来,你可以按自己的项目需求继续安装框架、调试工具,逐步构建起属于自己的开发工作流。

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系bd@zhengruan.com
作者最新文章
编程开发 Ubuntu
相关文章 更多
Ubuntu命令行入门:打开终端并验证文件目录操作
Ubuntu命令行入门:打开终端并验证文件目录操作

本教程指导Ubuntu新手打开终端,通过pwd、ls、cd、mkdir和touch命令完成基础文件目录操作。适用于桌面版、虚拟机及WSL环境,提供从查看路径到创建测试文件的完整验证步骤,帮助读者建立命令行操作的安全意识与正确习惯。

在VMware中安装Ubuntu并验证启动的完整步骤
在VMware中安装Ubuntu并验证启动的完整步骤

本文提供在VMware中安装Ubuntu并验证启动的完整流程。适用于首次练习Linux或搭建开发环境的用户。按步骤完成虚拟机创建、ISO挂载、硬件分配与安装后,可通过终端命令确认版本、内核与网络状态,确保系统可正常使用。

Ubuntu 26.04 将显著提升英伟达图形显卡在 Wayland 环境下的性能
Ubuntu 26.04 将显著提升英伟达图形显卡在 Wayland 环境下的性能

Ubuntu26.04LTS针对英伟达显卡在Wayland+GNOME环境进行性能调优,通过修改gbm_surface_lock_front_buffer函数,将帧渲染等待时间从毫秒级降至微秒级,显著提升UI响应和画面流畅度。该补丁已作为发行版专属补丁集成,确保LTS用户无需等待上游整合即可获得优化体验。

Ubuntu Touch 24.04-2.0 Beta 发布:适配索尼 Xperia X 等手机 提升上网体验
Ubuntu Touch 24.04-2.0 Beta 发布:适配索尼 Xperia X 等手机 提升上网体验

UbuntuTouch24.04-2.0Beta发布,底层升级至Ubuntu24.04,浏览器引擎从Chromium87跃升至134,网页兼容性显著提升;新增屏幕刘海区域自动适配、截图编辑器、网络指示器改进、移动数据可靠性增强、数据加密稳定,并新增NothingPhone(1)等设备支持。

Ubuntu如何查看系统防火墙规则
Ubuntu如何查看系统防火墙规则

ufw status仅显示高层策略和显式添加的规则(如“80 ALLOW Anywhere”),不反映默认策略绕过、IPv6独立规则、Docker等直写nftables的bypass规则,也无法体现本地回环流量不受管控等底层细节。Ubuntu 默认用 ufw 管理防火墙,但规则实际由 nftable

Ubuntu如何更换锁屏背景图片
Ubuntu如何更换锁屏背景图片

锁屏背景和桌面壁纸之所以不同,是因为GNOME默认会复制桌面壁纸,然后强制叠加高斯模糊和亮度调整效果,这个效果是由lockDialogGroup的CSS来控制的。要是想去除模糊,建议使用Control Blur Effect On Lock Screen扩展,把Adjust Sigma设置为0就行。

UbuntuSwapper在服务器上应用效果如何
UbuntuSwapper在服务器上应用效果如何

Ubuntu Swapper(一般就是指Ubuntu的交换分区或者交换文件)在服务器上的应用成效,是由多个因素共同决定的,像服务器的硬件配置情况、工作负载的类型以及交换空间的大小和具体配置等。下面为大家带来一些有关Ubuntu Swapper在服务器上应用效果的一般性评价:正面效果内存管理:交换空间

Ubuntu如何配置命令行模式下的中文支持
Ubuntu如何配置命令行模式下的中文支持

根本原因是纯命令行tty默认不支持UTF-8及中文字体渲染,locale设置仅影响字符解析逻辑,不解决字体绘制问题;图形终端自带UTF-8渲染,而tty需借助fbterm等工具实现中文显示。为什么终端里中文显示为问号或方块 纯命令行(tty,例如通过Ctrl+Alt+F3进入的界面)默认不会加载UT

如何通过Tomcat日志提升Ubuntu服务器性能
如何通过Tomcat日志提升Ubuntu服务器性能

通过分析Tomcat日志来提升Ubuntu服务器性能是一个很好的方法。以下是一些步骤和建议,帮助你通过Tomcat日志来优化服务器性能:1. 收集日志首先,得保证你的Tomcat服务器有详细的日志记录配置。在conf/logging.properties文件里,你可以对日志级别和输出格式进行调整。o

Ubuntu如何设置具体的命令行配色
Ubuntu如何设置具体的命令行配色

直接修改PS1是最为可控且轻量的方法。因为GNOME Terminal主题难以区分提示符、命令输入与输出,而PS1搭配ANSI转义码能够精准地为各个字段上色,并且需要用[ ]进行包裹,以防止光标出现错位的情况。直接改 PS1 是最可控、最轻量的方式,不需要装框架或改终端全局配色。 为什么不用改 GN

查看更多
精品专题 更多
装机必备
装机必备

正软商城装机必备专区,精选办公、浏览器、安全防护、影音播放、压缩解压、设计创作和系统工具等电脑常用正版软件,帮助用户快速完成新电脑软件配置。

Windows
Windows

正软商城Windows软件专区,汇集适用于Windows电脑的办公、设计、安全防护、影音播放、开发工具和系统优化软件,提供软件介绍、系统要求、正版授权及购买下载服务。

PDF教程
PDF教程

正软商城PDF教程频道提供PDF编辑、转换、合并、拆分、压缩及格式处理方法,同时介绍常用PDF软件和工具的使用技巧。

Mac软件 更多
Postman macOS版
Postman macOS版
Mac

Postman是一套面向API全生命周期的开发与测试平台,可在Mac上发送和调试多种协议请求,管理集合、环境及认证信息,并完成脚本测试、模拟服务、监控、文档发布和团队协作。它适合开发、测试及运维人员使用,提供个人免费方案。

Docker Desktop macOS版
Docker Desktop macOS版
Mac

Docker Desktop 是 Docker 官方为 Mac 提供的容器开发环境,集成 Docker Engine、命令行工具、Compose、Build、Kubernetes 与图形化管理界面。

Android Studio macOS版
Android Studio macOS版
Mac

Android Studio 是 Google 面向安卓应用开发提供的官方集成开发环境,基于 IntelliJ IDEA 构建。它整合智能代码编辑、Gradle 构建、界面预览、设备模拟、性能分析、调试测试及 APK 分析等工具。

WINDOWS 更多
Postman Windows版
Postman Windows版
Windows

Postman 是面向 API 全生命周期的开发与协作平台。Windows 桌面版可用于构建和发送 HTTP、GraphQL、gRPC、WebSocket、MQTT 等请求,并提供环境变量、集合、脚本测试、模拟服务、监控、文档及团队工作区等

Docker Desktop Windows版
Docker Desktop Windows版
Windows

Docker Desktop 为 Windows 开发者提供集成式容器环境,内置 Docker Engine、命令行工具、Compose、Build 与 Kubernetes 等组件,可在本机完成镜像构建、容器运行、日志查看和资源管理。

Android Studio Windows版
Android Studio Windows版
Windows

Android Studio 是 Google 面向 Android 应用开发提供的官方集成开发环境,以 IntelliJ IDEA 为基础,集成智能代码编辑、Gradle 构建、设备模拟、界面预览、调试测试及性能分析工具,