💫 One tool to rule them all
Launch a local development server with live reload feature for static & dynamic pages.
Polymer
, Svelte
, Vue
, React
, Angular
or plain js.typescript
, coffeescript
, sass
, scss
, less
and pug
.HTTP2/HTTPS
support.Open a project and click to Go Live
from the status bar to turn the server on/off. Click Build
button to make a production build.
Right click on a project file from Explorer Window and click on Serve project
.
.
Open a project file and right-click on the editor and click on Serve project
.
Open a project and build it or start/stop server from a touchbar.
Hit (alt+H, alt+O)
to Open the Server, (alt+H, alt+C)
to Stop the server (alt+H, alt+B)
to Build the Project and (alt+H, alt+R)
to Build specific resource (You can change the shortcut form keybinding) [On MAC, cmd+H, cmd+O
, cmd+H, cmd+C
and cmd+H, cmd+B
]
Open the Command Pallete by pressing F1
or ctrl+shift+P
and type HQ Live Server: Serve project
to start a server, type HQ Live Server: Stop Server
to stop a server, HQ Live Server: Build project
to make a production build or HQ Live Server: Build resource
to make a production build of specific resource.
Open VSCode and type ctrl+P
, type ext install hqjs.hq-live-server
.
Note that you should have nodejs >= 12.10.0
installed as default in your system. You can do it with nvm
nvm i 12
nvm alias default 12
How to access the server from Mobile?
After you pressed Go Live
button server address will appear
follow this address on your mobile device within your local network.
Are Multi-root workspaces supported?
Yes, you can run separate server instance for every project in your workspace.
Do I need to configure webpack or babel to start development?
No, you can press Go Live
button and start development immediatly. Extension will take care of everything else.
Can I create production build without any configuration?
Yes, you can press Build
button and production build will be created
in a dist
folder (please, note: all previous content of dist
folder will be erased).
How to run server in HTTP2/HTTPS
mode?
Create pair of certificate and a key in .pem
format and put them somewhere inside your project. Server will automatically recognise them and start in HTTP2/HTTPS mode. For generating self signed certificates check this tool.
hqServer.defaultPort
: Preferred Port Number for your Live Server.
8080
.hqServer.showOnStatusbar
: Display Go Live
button on the statusbar.
true
.hqServer.browser.useBuiltinBrowser
: Open in Browser Preview extension inside VS Code, instead of default browser.
false
.hqServer.browser.preferredBrowser
: To change your system's default browser.
""
. (It will open your system's default browser.)Not enough? need more? open an/a issue/pull request on github. For now, use hqServer.browser.browserCmdLine
settings (see below).
hqServer.browser.browserCmdLine
: To set your any favorite browser (Eg: Chrome Canary, Firefox Nightly) using advance Command Line. (You can specify full path of your favorite custom browser).
Preferred Browser
and Attach Chrome Debugger
settings.""
hqServer.browser.attachChromeDebugger
: To Enable Chrome Debugging Attachment to Live Server.
NOTE: You must have to install Debugger for Chrome.
If the value is true
, Start Live Server and select 'Attach to Chrome' from Debug Window to start debugging. Debugger for Chrome
Extension will inject debugging feature into running instance of browser window.
Default value is false
.
This extension is licensed under the MIT License