vue3打包后css和js的路径不对问题

1。注意，如果路由时history的模式，下面用法

参照官网后发现正确方法

部署 | Vue CLI

比如，我要把打包好的项目放在XXXXX.cn/chen/vue3下面

（1）需要在 vue.config.js的文件中做如下设置

 module.exports = {
  //用于打包后修改路径，陈，最后上传时使用的设置，20211116
  //参照了官网用法https://cli.vuejs.org/zh/guide/deployment.html#github-pages
  publicPath: process.env.NODE_ENV === "production" ? "/chen/vue3/" : "/",
  // publicPath: './',
  outputDir: 'dist',
  assetsDir: 'static',

  //上传到服务器后，由于ngix已经使用了代理，所以注释掉下面的代理
  //本计算机自己调试的时候需要用到下面本地代理，放出来
  // devServer: {
  //   proxy: {
  //     '/XXXXapi': {//代理api
  //             target: "http://localhost:6699",// 代理接口(注意只要域名就够了)
  // //             target: "http://192.168.?.??:6699",// 代理接口(注意只要域名就够了)
  //             changeOrigin: true,//是否跨域
  //             ws: true, // proxy websockets
  //             pathRewrite: {//重写路径
  //                 "^/bigviewapi": ''//代理路径
  //             }
  //       }
  //     },
  // }
}

路由

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  // history: createWebHashHistory(process.env.BASE_URL),  
  routes
})

2。注意，如果路由时hash的模式，下面用法

 module.exports = {
  //用于打包后修改路径，陈，最后上传时使用的设置，20211116
  //参照了官网用法https://cli.vuejs.org/zh/guide/deployment.html#github-pages
  //publicPath: process.env.NODE_ENV === "production" ? "/chen/vue3/" : "/",
  //更推荐以下用法
  publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
  //publicPath: './',
  outputDir: 'dist',
  assetsDir: 'static',

  //上传到服务器后，由于ngix已经使用了代理，所以注释掉下面的代理
  //本计算机自己调试的时候需要用到下面本地代理，放出来
  // devServer: {
  //   proxy: {
  //     '/XXXXapi': {//代理api
  //             target: "http://localhost:6699",// 代理接口(注意只要域名就够了)
  // //             target: "http://192.168.?.??:6699",// 代理接口(注意只要域名就够了)
  //             changeOrigin: true,//是否跨域
  //             ws: true, // proxy websockets
  //             pathRewrite: {//重写路径
  //                 "^/bigviewapi": ''//代理路径
  //             }
  //       }
  //     },
  // }
}

路由

const router = createRouter({
  // history: createWebHistory(process.env.BASE_URL),
  history: createWebHashHistory(process.env.BASE_URL),  
  routes
})