如何在Linux上搭建JS开发环境

Linux上搭建JS开发环境

一安装 Node.js 与包管理器

系统包管理器安装（简单稳定，版本可能偏旧）

Ubuntu/Debian

sudo apt update
sudo apt install -y nodejs npm

CentOS/RHEL（先启用 EPEL）

sudo yum install -y epel-release
sudo yum install -y nodejs npm

使用 NVM 安装（推荐，便于多版本切换）

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
source ~/.bashrc
nvm install --lts     # 或 nvm install node
nvm use --lts

使用 NodeSource 仓库（获取更新版本）

# Ubuntu/Debian 示例（按需替换版本号）
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt-get install -y nodejs

验证安装
```
node -v
npm -v
```

以上方法覆盖系统包管理器、NVM 与 NodeSource 三种常见方式，适合不同版本与灵活性需求。

二选择与安装编辑器

推荐安装 Visual Studio Code

sudo apt update
sudo apt install -y software-properties-common apt-transport-https wget
wget -q https://packages.microsoft.com/keys/microsoft.asc -O- | sudo apt-key add -
sudo add-apt-repository "deb [arch=amd64] https://packages.microsoft.com/repos/vscode stable main"
sudo apt update
sudo apt install -y code

常用扩展

code --install-extension dbaeumer.vscode-eslint
code --install-extension esbenp.prettier-vscode
code --install-extension msjsdiag.debugger-for-chrome

VS Code 提供完善的 JS/TS 生态与调试体验，配合 ESLint、Prettier 可显著提升代码质量与一致性。

三创建项目与运行调试

初始化项目

mkdir my-js-project && cd $_
npm init -y

安装常用开发依赖（按需）

npm i -D webpack webpack-cli babel-loader @babel/core @babel/preset-env
npm i -D webpack-dev-server

启动本地开发服务器（示例脚本）

# package.json
{
  "scripts": { "start": "webpack serve --open" }
}
npm start

运行与调试
```
node index.js
node inspect app.js
```

VS Code 调试配置示例（.vscode/launch.json）

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/index.js"
    }
  ]
}

以上覆盖了从初始化、依赖管理、开发服务器到断点调试的完整链路。

四前端项目与浏览器运行

浏览器直接运行

创建 index.html

<!doctype html>
<meta charset="utf-8">
<title>JS in Browser</title>
<script src="index.js"></script>

用浏览器打开 index.html 即可执行 JS。

使用现代前端工作流
- 通过 npm/yarn 管理依赖与脚本
- 使用 Webpack Dev Server 提供热更新与本地预览
```
npm i -D webpack-dev-server
```
- 浏览器开发者工具（F12）可用于 Console、Sources 等调试以上方式兼顾入门与工程化开发场景。

五进阶与常用工具

进程管理（生产环境）

npm i -g pm2
pm2 start app.js --name "my-app"
pm2 logs
pm2 monit

其他运行时与包管理器

Deno（内置 TypeScript 支持）

curl -fsSL https://deno.land/x/install/install.sh | sh
deno run deno_app.js

Yarn

curl -o- -L https://yarnpkg.com/install.sh | bash
yarn init -y

版本控制与协作

sudo apt install -y git
git init
git add .
git commit -m "Initial commit"

以上工具覆盖进程守护、替代运行时与团队协作基础能力。

最新问答

相关标签