主机->操作系统->window(.net)/Linux->tomcat/nginx(软件反向代理)

1.vue项目打包到dist文件夹(之后把dist文件夹放到服务器就可以了)

  npm run build

2.去https://nginx.org/官网下载nginx

  

这里有很多版本,我们选择stable version

  点击进入下载页面

  

 3.安装nginx

  进入安装路径双击nginx.exe

  若是一闪而过,在浏览器中输入localhost,若是出现以下类似页面:

   

  打开控制面板中的管理工具->服务->找到IIS

  

  双击打开,选择停止(因为端口可能被占用)

  

  之后重新双击nginx.exe,在浏览器输入localhost,出现一些页面则安装成功

  

4.显示自己打包的页面

    找到自己项目中的dist文件夹

  

  复制到nginx文件夹下的html中,把之前nginx默认的index.html等删除,把我们dist里面的文件放到ngnix的html文件中,

  如图:

  

  之后回到浏览器中刷新,就是我们打包过后的页面了

  

完成!注意ngnix文件名路径不能带有中文!

还有一种方式是修改nginx的配置文件,可以自己去百度搜索查看

nginx-vue项目在window下的部署的更多相关文章

  1. 阿里云安装Nginx+vue项目部署

    阿里云安装Nginx+vue项目部署 nginx安装包下载 http://nginx.org/en/download.html nginx安装 首先先安装PCRE pcre-devel 和Zlib,因 ...

  2. docker部署nginx+vue项目

    1.vue项目打包 npm run build 会在项目生成dist文件夹,这个文件夹可以使用nginx或tomcat来发布服务 2.查找nginx基础镜像 可以通过以下网站找到符合自己的基础镜像,我 ...

  3. Vue项目在Docker的自动化部署

    操作系统:CentOS 部署环境:Docker CI/CD工具:Jenkins 1.环境配置 安装Jenkins:Centos安装Jenkins 安装Docker:Centos安装Git.DotNet ...

  4. Vue项目history模式下微信分享总结

    原文 : http://justyeh.top/post/39/ 2019-07-02 Vue微信分享 每回遇到微信分享都是一个坑,目前的商城项目使用Vue开发,采用history的路由模式,配置微信 ...

  5. vue项目在IE下报 [vuex] vuex requires a Promise polyfill in this browser问题

    如下图所示,项目在IE11下打开报错: 因为使用了 ES6 中用来传递异步消息的的Promise,而IE浏览器都不支持. 解决方法: 第一步: 安装 babel-polyfill . babel-po ...

  6. React/Vue 项目在 GitHub Pages 上部署时资源的路径问题

    GitHub Pages 常被用来部署个人博客,而无论是大名鼎鼎的 Jekyll,还是 Hugo 或者 Hexo,他们都是将我们的文章嵌入模板,发布为静态页面,也就是说,GitHub Pages (G ...

  7. spring boot web项目在IDEA下热部署解决办法(四步搞定)

    最近在用spring boot 做一个web站点,修改了类.html.js等,刷新页面,没有生效,非要手动去make一下或者重启,大大降低了开发效率. 什么是热部署? 应用启动后会把编译好的Class ...

  8. vue项目在IE下显示空白打不开问题

    近期遇到了项目是vue做的,在IE浏览器下打不开,显示空白问题,解决方案如下: 打不开的原因是因为少了babel-polyfill处理器,所以第一步需要下载: npm install babel-po ...

  9. vue项目在IE下报 [vuex] vuex requires a Promise polyfill in this browser错误

    ie浏览器下报错 vue刚搭建的项目,在谷歌浏览器能够正常访问,但是在ie11等ie浏览器下无法显示页面,打开控制台查看无报错信息,打开仿真一栏,提示[vuex] vuex requires a Pr ...

随机推荐

  1. 关于学习java虚拟机的知识整理一:jvm内存区域

    之前由于考研,对于虚拟机的认识疏忽了太多,现在重新整理回顾一下. 如上图所示,jvm的内存区域(运行时数据区)共分为5处:方法区(Method Area).虚拟机栈(vm Stack).本地方法栈(N ...

  2. springMVC项目配置文件

    一.springMVC项目配置文件 1.web.xml文件全局配置 <servlet> <servlet-name> dispatcher </servlet-name& ...

  3. 4.Docker Compose 部署 Nexus

    什么是 Nexus Nexus 是一个强大的 Maven 仓库管理器,极大地简化了内部仓库的维护和外部仓库的访问.2016 年 4 月 6 日 Nexus 3.0 版本发布,相较 2.x 版本有了很大 ...

  4. JS 百度地图-右键菜单

    JS 百度地图-右键菜单 /*-----------------标注右键删除-------------------------*/ var markerMenu = new BMap.ContextM ...

  5. js -- 移动端pc端自动切换

    1. 判断浏览器类型 浏览器判断使用的github开源项目current-device,下面是地址: https://github.com/matthewhudson/current-device 在 ...

  6. canvas转盘转动?

    怎么实现类似转盘转动的效果? 现在这种实现思路是,canvas每次draw()并不是让图形在旋转,而是让每一份的颜色改变到达好像是转动的效果, 但是现在有一个问题,一开始渲染的颜色数量于份数是相同的, ...

  7. VSCode常用插件之Simple New File使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 Simple New File这是一个从命令面板简单创建新文件.文件夹.通过侧边栏创建新文件可能会很繁琐.该扩展旨在通过命令面板使创建文件或目 ...

  8. beego——view 模板语法

    一.基本语法 go统一使用{{和}}作为左右标签,没有其它的标签符号. 使用"."来访问当前位置的上下文,使用"$"来引用当前模板根级的上下文,使用$var来访 ...

  9. Pytest学习7-参数化

    在测试过程中,参数化是必不可少的功能,本文就讨论下pytest的几种参数化方法 @pytest.mark.parametrize:参数化测试函数 1.内置的pytest.mark.parametriz ...

  10. SQLserver 数据类型转换

    1:CAST  方法 CAST(任何有效的表达试  AS 要转换的数据类型 [数据类型的长度,可选]) 例:SELECT  CAST(10000 as varchar(10)) SELECT  CAS ...