Home > Software design >  How do I get new HTML files to execute in VS Code?
How do I get new HTML files to execute in VS Code?

Time:03-15

I have recently started learning WebDev using Colt Steele Udemy course. I've created few HTML files and whenever I try to execute any of them only the first created .html file opens in Chrome. How do I get the other files to open in the browser. Eg: If I create 3 files i.e a.html, b.html & c.html only a.html opens in Chrome even if b/c is open in the editor. This happens with both debugging or run without debugging. My VS Code version is 1.65.2. Please advice.

The launch.json code is:

"version": "0.2.0",
  "configurations": [
    {
      "type": "pwa-chrome",
      "request": "launch",
      "name": "Open a.html",
      "file": "e:\\\\Colt Steele\\HTML the essentials\\a.html"
    }

CodePudding user response:

The launch configuration you're showing is telling VSCode what to do when running the project. You can change the launch configuration to open a different file by default:

{
  "type": "pwa-chrome",
  "request": "launch",
  "name": "Open b.html",
  "file": "e:\\\\Colt Steele\\HTML the essentials\\b.html"
}

Or perhaps add multiple launch configurations, which you can select when debugging/running:

{
  "type": "pwa-chrome",
  "request": "launch",
  "name": "Open a.html",
  "file": "e:\\\\Colt Steele\\HTML the essentials\\a.html"
},
{
  "type": "pwa-chrome",
  "request": "launch",
  "name": "Open b.html",
  "file": "e:\\\\Colt Steele\\HTML the essentials\\b.html"
}

In general any given "application" would have a single default page as the entry point, and from there you can navigate through the application to use the other pages. So you might have a single index.html as the launch file, and in whatever you're building there would be links to other files as needed for the application.

But if what you're building for whatever reason truly has different "entry points" then you can just set up your build configurations based on that and select which configuration to use when running the application.


Alternatively (and I haven't tested this), you should be able to tell it to launch "the current file" by using a variable called file in the launch config:

{
  "type": "pwa-chrome",
  "request": "launch",
  "name": "Open Current File",
  "program": "${file}"
}
  • Related