AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

vue打包部署问题

2024-05-10 41
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Vue项目`vue.config.js`中，`publicPath`设定为"/h5/party/pc/"，在线环境基于打包后的`dist`目录，而非Linux的`/root`。Nginx代理配置位于`/usr/local/nginx/nginx-1.13.7/conf`，包含两个相关配置图。
  1. 因为vue项目配置文件 vue.config.js 资源路径是 /h5/party/pc/

/h5/party/pc 在线上环境中不是指向 linux 的 /root 目录下

而是 以 vue的打包文件 dist 为根目录，在dist 文件下的 /h5/party/pc/

publicPath: process.env.NODE_ENV === "production" ? "/h5/party/pc/" : "/h5/party/pc/",

image.png

  1. nginx代理配置

/usr/local/nginx/nginx-1.13.7/conf

image.pngimage.png

文章标签：
JavaScript
移动开发
应用服务中间件
nginx
Linux
关键词：
部署VUE.js
vue部署VUE.js
vue打包部署VUE.js
打包部署VUE.js
1529723250799936
目录
相关文章
人间真情在哪儿
|
3天前
|
JavaScript
vue消息订阅与发布
vue消息订阅与发布
人间真情在哪儿
108 59
刘大猫.
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-50.（了解）表单校验插件】
vue尚品汇商城项目-day07【vue插件-50.（了解）表单校验插件】
刘大猫.
11 4
刘大猫.
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【51.路由懒加载】
vue尚品汇商城项目-day07【51.路由懒加载】
刘大猫.
12 4
游客qeoynko2nmbgk
|
3天前
|
JavaScript 前端开发
Vue学习笔记8：解决Vue学习笔记7中用v-for指令渲染列表遇到两个问题
Vue学习笔记8：解决Vue学习笔记7中用v-for指令渲染列表遇到两个问题
游客qeoynko2nmbgk
13 5
刘大猫.
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-54.（了解）生成二维码插件】
vue尚品汇商城项目-day07【vue插件-54.（了解）生成二维码插件】
刘大猫.
8 2
我是小助手
|
缓存 资源调度 前端开发
用webpack4带你实现一个vue的打包的项目
一个用webpack4打包的vue 的项目，参照vue-cli的webpack配置，一步一步带你实现一个vue的打包的项目，每一个commit对应一个步骤。
我是小助手
2969 0
杀死一只知更鸟debug
|
5天前
|
JavaScript
vue组件中的插槽
本文介绍了Vue中组件的插槽使用，包括单个插槽和多个具名插槽的定义及在父组件中的使用方法，展示了如何通过插槽将父组件的内容插入到子组件的指定位置。
杀死一只知更鸟debug
14 1
游客qeoynko2nmbgk
|
4天前
|
JavaScript 前端开发 IDE
Vue学习笔记5：用Vue的事件监听 实现数据更新的实时视图显示
Vue学习笔记5：用Vue的事件监听 实现数据更新的实时视图显示
游客qeoynko2nmbgk
21 7
游客qeoynko2nmbgk
|
4天前
|
JavaScript 前端开发 API
Vue学习笔记4：用reactive() 实现数据更新的实时视图显示
Vue学习笔记4：用reactive() 实现数据更新的实时视图显示
游客qeoynko2nmbgk
22 5
游客qeoynko2nmbgk
|
3天前
|
JavaScript 前端开发 API
Vue学习笔记7：使用v-for指令渲染列表
Vue学习笔记7：使用v-for指令渲染列表
游客qeoynko2nmbgk
10 3

热门文章

最新文章

  • 1
    vite 如何做到让 vue 本地开发更快速？
  • 2
    VUE element-ui之form表单中input输入超过规定长度error提醒，并实时显示输入长度，可无限输入
  • 3
    【第12期】Vue3+TypeScript+Vite中动态引入图片等静态资源
  • 4
    基于Vue和SpringBoot的电商管理系统的设计与实现（一）
  • 5
    前端vue给后端list集合对象传值
  • 6
    VUE组件：如何在Vue中实现组件的动态引入？
  • 7
    Vue3 自定义指令实现元素点击的节流与输入框的防抖,后端老哥再也不用担心我频繁发送请求了
  • 8
    Vue 父子组件通信 兄弟组件通信 深层组件通信 方式一览
  • 9
    vue后台管理系统小功能
  • 10
    Vue —— 基础（二）（计算属性、监听属性）
  • 1
    【vue的技术要点】
    78
  • 2
    【vue2中引入阿里第三方图标库使用自定义的Ant Design Vue组件a-cascader级联选择后缀图标】
    394
  • 3
    在vue中，在哪个生命周期内调用异步请求？
    251
  • 4
    在vue中，Vue 的父组件和子组件生命周期钩子函数执行顺序？
    64
  • 5
    在vue中，直接给一个数组项赋值，Vue 能检测到变化吗？
    206
  • 6
    在vue中，computed 和 watch 的区别和运用的场景？
    64
  • 7
    在vue中，怎样理解 Vue 的单向数据流？
    60
  • 8
    在vue中，Class 与 Style 如何动态绑定？
    43
  • 9
    在vue中，v-show 与 v-if 有什么区别？
    40
  • 10
    在vue中，如何实现SPA单页面应用的路由管理？
    58

    • 相关课程

    更多
  • Spring Boot+Vue.js+FastDFS实现分布式图片服务器
  • Vue.js 入门与实战
  • Vue.js完全自学手册图文教程
  • React 入门教程开发文档
  • 前端自动化构建工具 Webpack
  • React 入门与实战

    • 相关电子书

    更多
  • Vue.js 在前端服务化上的探索与实践
  • Vue.js在前端服务化上的实践与探索
  • 利用编译将 Vue 组件转成 React 组件

    • 相关实验场景

    更多
  • 前端开发基础6：Node.js和LESS预编译工具
  • 搭建Node.js编程环境
    • 下一篇
    无影云桌面