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
})

# javascript # css # 前端
Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue