路由的 base 和webpack的publicPath（vite的base）区别_vite publicpath

1. webpack中的output选项有两个重要配置: path和publicPath

• output.path 打包输出的目录，必须为一个绝对路径

  eg:

  output: {
   path: path.resolve(__dirname, '../dist'),
  }
  1
  2
  3

  打包文件放置在dist目录下， _dirname 为当前文件在电脑中的绝对路径名，/a/b/dist， /a/b/就是 _dirname，path.resolve（）通过这两个参数就能指定打包后dist文件放在项目的哪个位置。

• publicPath：所有静态资源的一个基础路径，服务器从哪个目录开始寻找资源（js，css，image）。publicPath对于打包路径不会有任何影响，影响的是服务器寻找静态资源包。

  eg：

  output: {
      publicPath: '/my-app/'
  }
  1
  2
  3

  默认为“/”，即index.html以及其他静态资源包直接在nginx/html的目录下。如果规定路径为“/my-app”，则从nginx/html/my-app/的目录下开始解析。

  所以publicPath为线上部署的路径，需要和运维商量好，运维将静态资源包需要放置在这里面，项目才能找到才能启动。

2. 路由的base

应用的基路径。
例如，如果整个单页应用部署 在 /app/ 下， base 就应该设为 /app/。
需要和线上服务的路径（webpack的publicPath等）一致，因为切换路由时，找页面组件资源时，是从该静态资源文件夹中找。