如何在 WebStorm 中配置一个 Web 服务器

• WebStorm 会启动一个内置的 HTTP 服务器并在默认浏览器中打开该文件。

安装 Node.js：

• 确保系统已安装 Node.js，可以通过以下命令验证： node -v
  npm -v
• 如果未安装，前往 Node.js 官方网站 下载并安装。

创建服务器文件：

• 在项目中创建一个文件 server.js，内容如下： const http = require('http');
  const fs = require('fs');
  const path = require('path');

  const server = http.createServer((req, res) => {
  let filePath = '.' + req.url;
  if (filePath === './') {
  filePath = './index.html';
  }

  const extname = String(path.extname(filePath)).toLowerCase();
  const mimeTypes = {
  '.html': 'text/html',
  '.js': 'text/javascript',
  '.css': 'text/css',
  '.json': 'application/json',
  '.png': 'image/png',
  '.jpg': 'image/jpg',
  '.gif': 'image/gif',
  '.svg': 'image/svg+xml',
  };

  const contentType = mimeTypes[extname] || 'application/octet-stream';

  fs.readFile(filePath, (error, content) => {
  if (error) {
  if (error.code === 'ENOENT') {
  res.writeHead(404, { 'Content-Type': 'text/html' });
  res.end('<h1>404 Not Found</h1>', 'utf-8');
  } else {
  res.writeHead(500);
  res.end(`Server Error: ${error.code}`, 'utf-8');
  }
  } else {
  res.writeHead(200, { 'Content-Type': contentType });
  res.end(content, 'utf-8');
  }
  });
  });

  const PORT = 8080;
  server.listen(PORT, () => {
  console.log(`Server running at http://localhost:${PORT}/`);
  });

运行服务器：

• 打开 WebStorm 的 Terminal（快捷键：Alt + F12 或 Ctrl + ~）。
• 运行以下命令启动服务器： node server.js
• 访问 http://localhost:8080 查看你的 Web 服务器。

调试服务器：

• 在 WebStorm 中设置一个 Run/Debug Configuration：
  • 选择 Add Configuration (+) > Node.js。
  • 设置入口文件为 server.js。
  • 点击 Run 按钮启动服务器，并在 WebStorm 内调试代码。

安装 Nginx：

• 在 macOS 上，可以使用 Homebrew 安装： brew install nginx

编辑 Nginx 配置文件：

• 打开 Nginx 配置文件（通常位于 /usr/local/etc/nginx/nginx.conf）。
• 添加以下内容： server {
  listen 8080;
  server_name localhost;

  location / {
  root /path/to/your/webstorm/project;
  index index.html;
  }
  }

启动 Nginx：

nginx

访问 http://localhost:8080 查看页面。