vue项目打包部署_nginx代理访问方法详解
更新时间：2018年09月20日 10:24:08 作者：kaola_l
今天小编就为大家分享一篇vue项目打包部署_nginx代理访问方法详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
我又来了，今天部署了下vue项目，使用nginx做了代理，这样可以解决跨域的问题，这里做一个简单讲解。
1、先看vue项目打包（我这里使用的是vscode开发工具）
这里是我的项目结构：
打包之前需要修改如下配置文件：
配置文件一：build>>utils.js (修改publicPath:"../../" , 这样写是处理打包后找不到静态文件的问题)
配置文件二：config>>index.js(修改assetsPublicPath:'./' ,修改目的是为了解决js找不到的问题)
上面两步修改完成之后就可以进行打包了
在控制台终端输入npm run build
坐等打包
打包完成之后项目中会生成一个dist文件夹，直接访问里面的index.html就ok了
我这里有点特殊的地方，需要修改下index.html文件，是因为自己加的一个moment.js
ok，到这里打包的事情完成了，下面就放到服务器上去了
我这里使用的windows版本的nginx做演示，linux的不做讲解了，还有nginx的下载安装也不做讲解，直接看配置：
配置完成后，去启动你的nginx，然后访问就ok了！
以上这篇vue项目打包部署_nginx代理访问方法详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了VUE程序调试的方法，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-06-06
这篇文章主要介绍了Python合成Excel表的实现代码（多sheet）,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2021-04-04
Vue3 vue-devtools 调试工具下载安装使用教程
vue-devtools是一款基于chrome游览器的插件，用于调试vue应用，这可以极大地提高我们的调试效率，尤其是对于初学vue的朋友来说可谓是一大利器，这篇文章主要介绍了Vue3 vue-devtools 调试工具下载安装,需要的朋友可以参考下2022-08-08
本文会通过一个简单的vue-toast插件，来帮助了解掌握插件的开发和使用。具有很好的参考价值，下面跟着小编一起来看下吧2017-03-03
Vue3 TypeScript 实现useRequest详情
本文介绍了Vue3 TypeScript实现useRequest详情，useRequest可能是目前社区中最强大，最接地气的请求类 Hooks了。可以覆盖99%的网络请求场景，无论是读还是写，无论是普通请求还是分页请求，无论是缓存还是防抖节流，通通都能支持，关于其介绍需要的小伙伴可以参考一下2022-05-05
vue computed计算属性显示undefined的解决
这篇文章主要介绍了vue computed计算属性显示undefined的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-11-11
vue插件--仿微信小程序showModel实现模态提示窗功能
这篇文章主要介绍了vue插件--仿微信小程序showModel实现模态提示窗,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-08-08
这篇文章主要介绍了el-select组件绑定change事件的踩坑记录，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
这篇文章主要为大家详细介绍了vuejs移动端实现div拖拽移动，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-07-07
这篇文章主要介绍了Vue实现todolist删除功能,，代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2018-06-06
最新评论