浏览器打开默认示例项目而非当前开发的项目该如何解决

• 若使用VS Code Live Server 插件
  打开VS Code设置页，搜索liveServer.settings.root，将配置值修改为自定义index.html所在文件夹的相对路径即可：若文件存放在项目根目录直接填/，若存放在根目录下的src文件夹则填/src。
• 若使用Vite、Webpack等工程化工具的内置开发服务器
  修改对应配置文件的入口指向：
  • Vite项目：打开根目录下的vite.config.js，添加root配置指定index.html所在目录：

    export default {
      root: './src' // 替换为你的自定义index.html所在目录路径
    }
    

  • Webpack项目：打开根目录下的webpack.config.js，同步修改devServer.static静态目录配置、HtmlWebpackPlugin.template入口模板路径：

    const HtmlWebpackPlugin = require('html-webpack-plugin');
    module.exports = {
      devServer: {
        static: './dist' // 替换为你的静态资源输出目录
      },
      plugins: [
        new HtmlWebpackPlugin({
          template: './src/index.html' // 替换为你的自定义index.html路径
        })
      ]
    }
    

• 若使用在线编程/实训平台
  进入项目设置页找到默认启动页配置项，将路径修改为自定义index.html的相对路径即可，部分平台要求入口文件必须放在项目根目录，注意文件名拼写区分大小写。
• 排查文件优先级冲突
  确认你的自定义index.html文件名拼写完全正确，不要写成Index.html、INDEX.HTML这类不符合默认识别规则的名称；如果项目根目录同时存在平台默认的入口文件，可以将其删除或重命名，让服务器优先读取你的自定义index.html。

内容的提问来源于stack exchange，提问作者Ishika Pal