温馨提示×

Debian JS如何配置开发环境

小樊
51
2025-10-02 08:59:37
栏目: 编程语言

Debian系统配置JavaScript(JS)开发环境详细步骤

1. 更新系统包列表

在安装任何软件前,建议先更新系统包列表以确保获取最新版本:

sudo apt update && sudo apt upgrade -y

2. 安装Node.js和npm(Node包管理器)

Node.js是JS的服务器端运行环境,npm用于管理项目依赖。推荐通过NodeSource仓库安装特定版本(如16.x、18.x),避免系统默认仓库版本过旧:

  • 步骤1:添加NodeSource仓库(以16.x为例)
    curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -
    
  • 步骤2:安装Node.js和npm
    sudo apt install -y nodejs
    
  • 验证安装
    node -v  # 查看Node.js版本(如v16.x.x)
    npm -v   # 查看npm版本(如8.x.x)
    
    若需灵活切换多个Node.js版本,可使用NVM(Node版本管理器)
    curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
    source ~/.bashrc  # 加载NVM环境
    nvm install 18    # 安装Node.js 18.x
    nvm use 18        # 切换至18.x版本
    

3. 安装代码编辑器

推荐使用Visual Studio Code(VS Code),其丰富的JS/TS插件能提升开发效率:

sudo snap install --classic code  # 通过Snap安装(推荐)

或通过APT安装(较慢):

sudo apt install software-properties-common apt-transport-https wget
wget -qO- https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > microsoft.gpg
sudo install -o root -g root -m 644 microsoft.gpg /etc/apt/trusted.gpg.d/
sudo sh -c 'echo "deb [arch=amd64] https://packages.microsoft.com/repos/vscode stable main" > /etc/apt/sources.list.d/vscode.list'
sudo apt update && sudo apt install code

安装必备插件

  • ESLint:代码质量检查
  • Prettier:代码格式化
  • JavaScript Debugger:调试工具
  • Live Server:快速启动本地开发服务器

4. 配置项目与依赖管理

  • 初始化项目:在项目目录下运行npm init,生成package.json文件(记录项目元数据和依赖):
    mkdir my-js-project && cd my-js-project
    npm init -y  # 使用默认配置快速初始化
    
  • 安装依赖
    • 生产依赖(项目运行必需,如Express框架):
      npm install express --save  # npm 5+会自动添加至dependencies
      
    • 开发依赖(仅开发阶段使用,如ESLint、Babel):
      npm install eslint --save-dev
      
  • 使用Yarn替代npm(可选):Yarn是更快的包管理器,安装后命令类似:
    sudo apt install yarn  # 或通过npm安装:npm install -g yarn
    yarn add express       # 安装生产依赖
    yarn add -D eslint     # 安装开发依赖
    

5. 安装常用开发工具

  • nodemon:自动重启Node.js应用(修改代码后无需手动重启):
    npm install -g nodemon
    nodemon server.js  # 启动应用,监听文件变化
    
  • Webpack:模块打包器(用于打包ES6+、React等现代JS项目):
    npm install --save-dev webpack webpack-cli babel-loader @babel/core @babel/preset-env
    
  • Babel:ES6+转译器(将新语法转换为旧浏览器兼容代码):
    需在项目根目录创建.babelrc文件,配置预设:
    {
      "presets": ["@babel/preset-env"]
    }
    

6. 可选:配置进程管理与反向代理

  • PM2进程管理:保持Node.js应用持续运行,支持日志、重启等功能:
    sudo npm install -g pm2
    pm2 start server.js  # 启动应用
    pm2 list             # 查看运行中的应用
    pm2 logs             # 查看日志
    
  • Nginx反向代理:将Nginx作为前端代理,提升安全性与性能:
    sudo apt install nginx
    sudo nano /etc/nginx/sites-available/default
    
    修改配置文件,添加反向代理规则(以代理到3000端口为例):
    server {
        listen 80;
        server_name your_domain.com;  # 替换为你的域名或IP
        location / {
            proxy_pass http://localhost:3000;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
    }
    
    测试配置并重启Nginx:
    sudo nginx -t  # 测试配置语法
    sudo systemctl reload nginx  # 重启Nginx
    

7. 测试开发环境

创建一个简单的Node.js服务器,验证环境是否正常:

# 创建server.js文件
nano server.js

输入以下代码:

const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello, Debian JS Development Environment!\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

运行服务器:

node server.js  # 或使用nodemon:nodemon server.js

在浏览器访问http://127.0.0.1:3000,若看到“Hello, Debian JS Development Environment!”则说明环境配置成功。

通过以上步骤,你已在Debian系统上搭建了一个完整的JavaScript开发环境,可根据项目需求进一步扩展(如添加React/Vue框架、数据库连接等)。

0