要部署前后端分離項目，首先需要將前端和后端的代碼分別打包成可部署的文件。

1. 前端部署：

   • 在前端項目中，使用構建工具（如Webpack、Parcel等）將前端代碼打包成靜態文件。這些文件通常包括HTML、CSS、JavaScript和靜態資源文件。
   • 將打包后的文件上傳到Tomcat服務器的webapps目錄下，可以創建一個新的目錄用于存放前端文件。

2. 后端部署：

   • 將后端項目打包成一個可執行的Java Web應用程序（如war文件）。具體打包方法可以參考Maven或Gradle的相關配置文件。
   • 將war文件上傳到Tomcat服務器的webapps目錄下。Tomcat會自動解壓war文件并部署應用程序。

3. 配置Tomcat：

   • 在Tomcat的conf目錄下，找到server.xml文件，修改其中的Host標簽，添加Context標簽用于配置前后端分離的項目。示例如下：

<Host name="localhost"  appBase="webapps"
            unpackWARs="true" autoDeploy="true">

      <Context path="/api" docBase="your-backend-app" reloadable="true"></Context>
      <Context path="/" docBase="your-frontend-app" reloadable="true"></Context>

      ...
</Host>

其中，your-backend-app是后端項目的目錄名或war文件名，your-frontend-app是前端項目的目錄名。

4. 啟動Tomcat：

   • 在Tomcat的bin目錄下，找到startup.bat（Windows）或startup.sh（Linux/Unix），雙擊運行或執行腳本文件，啟動Tomcat服務器。

5. 訪問項目：

   • 前端項目可以通過訪問http://localhost:8080來訪問。
   • 后端項目可以通過訪問http://localhost:8080/api來訪問。

注意事項：

• 前后端分離的項目需要保證前端和后端之間的跨域訪問，可以在后端服務器上配置CORS（跨源資源共享）策略，允許前端訪問后端接口。
• 建議使用Nginx等反向代理服務器來實現前后端分離項目的部署，可以提高性能和安全性。