【Vue】Antd Pro Vue的使用（四）—— 打包发布到站点二级目录，生产环境请求接口配置
CrazyPanda发表于：2024-04-27 23:32:54浏览：339次
如题，Antd Pro Vue开发完成后，要打包发布到站点指定二级目录下，
我这里服务端配置的是tp，在站点public文件夹新建一个system文件夹，前端打包后要放到个文件夹里面，
需要配置2步
1. 在根目录vue.config.js文件夹中配置publicPath
publicPath: '/system/',
2. 在/src/router/index.js文件中，增加base配置，配置内容与publicPath保持一致
router: {
mode: 'hash',
base: '/system/',
routes: [
// ... 路由配置
],
},
以上两部已经可以实现打包发布到站点system文件夹下了，接下来我们在处理下接口请求。
3. 在根目录.env文件中，配置请求连接如下
VUE_APP_API_BASE_URL=/index.php
可以看到配置的请求连接，省去了域名，这样配置好之后，直接访问http://xxx.xxx.com/system即可打开我们的站点页面，
好处就是即使换域名了也不需要修改请求连接，也不需要重新打包发布，nice！！！
猜你喜欢
- 【VUE】vue3组件间的通信，父组件调用子组件方法
- 文章目录一、父组件数据传递N个层级的子组件二、使用v-model指令实现父子组件的双向绑定三、父组件props向子组件传值四、子组件emit向父组件传值五、通过expose和ref来实现父组件调用子组件的方法vue3 provide 与 injectA组件名称 app.vueB组件名称 provideB.vueC组件名称 provideCSetup.vue父组件名称 app.vue子组件名称 v-modelSetup.vue子组件 propsSetup.vue父组件 app.vuevue3 ev
- 【Vue】Antd Pro Vue的使用（九） —— 抽屉a-drawer的操作按钮设置
- 在antd pro vue2中，a-drawer默认是没有操作按钮的，只有右上角的关闭'X'号，需要自己配置提交和取消按钮提交方法对应@submit方法，取消方法对应@close方法（a-model对应的取消方法是@cancel），都是父页面传过来的方法<a-drawer :title="model ? '编辑类型' : '新建类型'"
- 【Vue】vue创建应用并运行
- 简介Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。Vue 是一个框架，也是一个生态。其功能覆盖了大部分前端开发常见的需求。但 Web 世界是十分多样化的，不同的开发者在 Web 上构建的东西可能在形式和规模上会有很大的不同。考虑到这一点，Vue 的设计非常注重灵活性和
- 【Vue】Antd Pro Vue的使用（五）—— 多文件上传回显问题
- 需求： 多文件上传 ，上传的时候绑定fileList回显问题： 上传成功了，也拿到了后台返回的数据，但是onchang监听的时候，file的状态一直是uploading原因：onchange 只触发了一次解决： 使用单文件上传时@change事件会至少触发两次，一次file.status=uploading，最后一次要么是done或者error，handleUpload1(info) { if (info
- 【Vue】Vue3 开发实战分享——打印插件 Print.js 的使用（Vue3 + Nodejs + Print.js 实战）以及 el-table 与 el-pagination 的深入使用（下）
- 文章目录📋前情回顾&前言🎯关于 el-table1️⃣获取每行对应的内容数据2️⃣行内数据判断处理（过滤）3️⃣对表格内容的索引🧩项目中延申使用🎯关于 el-pagination1️⃣显示总条数与分页展示2️⃣跳转页和页码样式3️⃣设置为中文🧩项目中延申使用📝最后📋前情回顾&前言上一篇文章（Vue3 开发实战分享——打印插件 Print.js 的使用（Vue3 + Nodejs + Print.js 实战）以及 el-table 与 el-pagination 的深
- 【Vue】Vue中字符串数组和对象常用方法介绍
- 在Vue中，数组和字符串是我们最常处理的数据类型。Vue提供了响应式系统，可以自动跟踪数组和对象的变化，并响应式地更新DOM。在Vue中，您可以像在任何JavaScript应用程序中一样操作这些数据类型。下面时整理的Vue中字符串 数组 以及对象的常用操作方法。一.数组方法1.增删改： unshift、push、splice、shift、pop、splice、slice 1.1.unshift：在数组的头部添加内容// 数组.unshift("添加的值")
- 【Vue】Antd Pro Vue的使用（四）—— 打包发布到站点二级目录，生产环境请求接口配置
- 如题，Antd Pro Vue开发完成后，要打包发布到站点指定二级目录下，我这里服务端配置的是tp，在站点public文件夹新建一个system文件夹，前端打包后要放到个文件夹里面，需要配置2步1. 在根目录vue.config.js文件夹中配置publicPath publicPath: '/system/',2. 在/src/router/index.js文件中，增加base配置，配置内容与publicPath保持一致router: { &nbs
栏目分类全部>