在Visual Studio代码中运行Node HTTP Server的步骤 [英] Steps to run node http server in visual studio code

问题描述

我一直在尝试并到处搜索。除了错误和模糊的步骤之外，什么都没有让它起作用。

I've been trying and searching everywhere .got nothing but errors and vague steps in tutorials to get this to work.

如果您知道Visual Studio中的步骤在Windows上运行节点http服务器的代码（不是调试节点文件）可以指导我或告诉我是否缺少某些东西。

If you know the steps in visual studio code to run node http server for windows(not debugging node files) guide me or tell me if I'm missing something.

推荐答案

1。安装Node.js

如果尚未安装，请在此处获取： https://docs.npmjs.com/getting-started/installing-node

If not already installed, get it here: https://docs.npmjs.com/getting-started/installing-node

使用npm（用于获取和管理您的开发库的软件包管理器）

It comes with npm (the package manager for acquiring and managing your development libraries)

2。为您的项目创建一个新文件夹

在驱动器中的某个位置，为您的Web应用程序创建一个新文件夹。

Somewhere in your drive, create a new folder for your web app.

3。将package.json文件添加到项目文件夹

然后复制/粘贴以下文本：

Then copy/paste the following text:

{ 
   "name": "Demo", 
   "version": "1.0.0", 
   "description": "demo project.", 
   "scripts": { 
     "lite": "lite-server --port 10001", 
     "start": "npm run lite" 
   }, 
   "author": "", 
   "license": "ISC", 
   "devDependencies": { 
     "lite-server": "^1.3.1" 
   } 
}

4。安装Web服务器

在项目文件夹中打开的终端窗口（Windows中的命令提示符）中，运行以下命令：

In a terminal window (command prompt in Windows) opened on your project folder, run this command:

npm install

这将安装lite-server（在package.json中定义），这是一台静态服务器，可在默认浏览器中加载index.html并在应用程序文件更改时自动刷新它。

This will install lite-server (defined in package.json), a static server that loads index.html in your default browser and auto refreshes it when application files change.

5。启动本地Web服务器！

（假设您的项目文件夹中有index.html文件）。

(Assuming you have an index.html file in your project folder).

在同一终端窗口（Windows中的命令提示符）中运行以下命令：

In the same terminal window (command prompt in Windows) run this command:

npm start

稍等片刻，index.html将被加载并显示在本地Web服务器提供的默认浏览器中！

Wait a second and index.html is loaded and displayed in your default browser served by your local web server!

lite服务器正在监视您的文件，并在您对任何html，js或css文件进行更改后刷新页面。

lite-server is watching your files and refreshes the page as soon as you make changes to any html, js or css files.

如果您已将VS Code配置为自动保存（菜单文件/自动保存），则您在键入时会看到浏览器中的更改！

And if you have VS Code configured to auto save (menu File / Auto Save), you see changes in the browser as you type!

注意：

在当天完成应用程序编码之前，不要关闭命令行提示符
它在 http：// localhost：10001 ，但是您可以通过编辑package.json文件来更改端口。

Do not close the command line prompt until you’re done coding in your app for the day It opens on http://localhost:10001 but you can change the port by editing the package.json file.

资源：< a href = https://blogs.msdn.microsoft.com/cdndevs/2016/01/24/visual-studio-code-and-local-web-server/ rel = nofollow noreferrer> https：// blogs.msdn.microsoft.com/cdndevs/2016/01/24/visual-studio-code-and-local-web-server/

这篇关于在Visual Studio代码中运行Node HTTP Server的步骤的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！