How to configure Live Server in VSCODE

"Learn how to quickly set up a live server in VS Code with this step-by-step guide and example."

Configuring Live Server in VSCODE

Live Server is an extension for Visual Studio Code (VSCode) that allows you to quickly launch a development local server with live reload feature for static and dynamic pages. This extension can be used for testing and previewing projects, webpages and any kind of files without having to install and configure a web server.

In order to configure Live Server in VSCode, you need to open the Extensions view by pressing Ctrl+Shift+X (or Cmd+Shift+X on Mac). Then, search for Live Server and install it. After it is installed, you can launch it by pressing the Go Live button in the status bar.

Once Live Server is running, you can open your project or file in VSCode and make changes. When you save the file, it will automatically reload in the browser. You can customize the Live Server port by changing the value of the

"liveServer.settings.port"

setting in the settings.json file. By default, it is set to 5500.

You can also customize the Live Server root folder. By default, it is set to the workspace folder. However, you can customize it by changing the value of the

"liveServer.settings.root"

setting in the settings.json file. Here you can specify the path to the folder that should be used as the root.

Once you have configured the Live Server, you can start using it to quickly test and preview your projects and webpages. It is an invaluable tool for web development and it can be used to quickly set up a local development server with live reload.