React项目执行npm start后，如何默认打开localhost:3000/home？

当然可以实现！这里有两种常用的方案，你可以根据自己的需求来选：

如果你只是希望项目启动时，浏览器自动跳转到localhost:3000/home，直接修改项目根目录下的package.json里的start脚本就行：
把原来的：

"scripts": {
  "start": "react-scripts start"
}

改成：

"scripts": {
  "start": "react-scripts start --open http://localhost:3000/home"
}

这样执行npm start后，浏览器就会直接打开/home路径，不用手动跳转啦。

如果想要更周全的效果——不管是启动自动打开，还是用户手动输入localhost:3000，都自动跳转到/home，那就在React路由里配置重定向：

• 如果你用的是React Router v6，修改你的路由配置（比如App.js）：

import { Routes, Route, Navigate } from 'react-router-dom';
import Home from './pages/Home'; // 记得引入你的Home组件

function App() {
  return (
    <Routes>
      {/* 把根路径重定向到/home */}
      <Route path="/" element={<Navigate to="/home" replace />} />
      {/* 配置Home页面的路由 */}
      <Route path="/home" element={<Home />} />
      {/* 其他页面的路由配置... */}
    </Routes>
  );
}

export default App;

• 要是你用的是React Router v5及更早版本，就用Redirect组件：

import { Switch, Route, Redirect } from 'react-router-dom';
import Home from './pages/Home';

function App() {
  return (
    <Switch>
      <Route path="/home" component={Home} />
      {/* 从根路径重定向到/home */}
      <Redirect from="/" to="/home" />
    </Switch>
  );
}

export default App;

这种方法的好处是，不管用户怎么访问根路径，都会被自动引导到/home页面，体验更连贯。

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