前提是已经配置好了相应的外网和内网端口的映射

一.公网ip和端口配置

在vue项目启动之前对项目下：项目名/config/index.js 文件进行修改

原来的内容为：(位置在index.js的第16,17行作用)

    host: 'localhost', // can be overwritten by process.env.HOST

    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined

修改为0.0.0.0 和8070端口：

    host: '0.0.0.0', // can be overwritten by process.env.HOST

    port: 8070, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined

二.使用域名+端口访问配置

没有配置的情况下通过域名加端口访问出现：

在如下截图的位置加这个配置：

disableHostCheck: true,// 解决域名访问本地运行地址时出现Invalid Host header的问题

在此用：npm run dev  运行

此时用域名加端口访问正常

此种部署有很大的缺点，不适合生成环境中，只能用于项目代码测试

VUE项目部署公网ip和端口以及使用域名访问配置的更多相关文章

  1. django项目、vue项目部署云服务器

    目录 上线架构图 服务器购买与远程连接 安装git 安装mysql 安装redis(源码安装) 安装python3.8(源码安装) 安装uwsgi 安装虚拟环境 安装nginx(源码安装) vue项目 ...

  2. Vue项目无法使用局域网IP直接访问的配置方法

    一般使用 vue-cli 下来的项目是可以直接访问局域网 IP 打开的,比如 192.168.1.11:8080 .但是最近公司的一个项目只可以通过 localhost 访问. 需要配置一下,才可直接 ...

  3. node vue 项目部署问题汇总

    场景:vue-router为history模式,不带项目名访问的部署,如果资源是用相对路径加载,则资源匹配路径不对 一.带项目名称访问,如部署到tomcat服务上 webpack:  build/ut ...

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

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

  5. Vue项目部署问题及解决方案

    Vue项目部署问题及解决方案 Vue-Router 有两种模式,默认是 hash 模式,另外一种是 history 模式. hash:也就是地址栏里的 # 符号.比如 http://www.examp ...

  6. vue 项目部署

    vue项目部署到PHP项目 入口目录 vue项目打包后, 是一个单文件html 我们只需要把打包后的文件夹放在php项目的public下面 访问 xxx.com/h5/index.html 就可以访问 ...

  7. 将vue项目部署在Linux的Nginx下，并设置为局域网内访问

    1. 下载 wget http://nginx.org/download/nginx-1.12.2.tar.gz 2. 解压缩 tar -zxvf linux-nginx-1.12.2.tar.gz ...

  8. vue项目部署到IIS服务器上

    前端Vue项目需要部署到IIS服务器上: 准备工作: 1:部署IIS服务器 2:项目npm run build打包生成需要部署的文件(dist文件夹)我的是manage文件夹 开始部署: 1:复制文件 ...

  9. vue项目部署上线

    前言 今天把自己写的demo登录写完了,就想着试着走一下部署上线的流程.参考了很多的文档,终于成功进行了部署.在这里将服务器的搭建和vue项目的 部署上线进行整理(都是基础的知识,希望对大家有帮助.对 ...

随机推荐

  1. c数据结构 -- 链表的理解

    链表是结构体变量与结构体变量链接在一起,怎么链接在一起?通过指针 #include <stdio.h> struct Node{ int data; struct Node* next; ...

  2. input标签中的id和name的区别

    做网站很久了,但到现在还没有搞明白input中name和id的区别,最近学习jquery,又遇到这个问题,就在网上搜集资料.看到这篇,就整理出来,以备后用. 可 以说几乎每个做过Web开发的人都问过, ...

  3. 使用命令把SpringBoot项目打包成可运行的jar包（简洁，操作性强）

    前几天接到一个需求,要把原系统中一个数据处理小功能搬出原系统,拉出来单独做一个SpringBoot项目,然后打成jar包扔到Windows服务器上运行,这样数据处理的时候如果遇到堵塞就不至于整个系统都 ...

  4. 找到所有的txt文件并删除

    1.find /oldboy/ -type f -name "*.txt" -delete 2.find /oldboy/ -type f -name "*.txt&qu ...

  5. [git] git合并冲突 本地已有项目上传 各种问题

    git... 讲道理 我现在能隐约感觉到他的强大控制能力了 但是依旧是不习惯.... 无论是什么操作 在我这里都会出问题,,,, 上传本地已有的项目到码云 首先需要现在码云创建一个仓库 然后用git工 ...

  6. 题解【CodeForces171C】A Piece of Cake

    Description 给你\(n\)个数,求出\(\sum_{i=1}^{n} a_{i}\times i\qquad\) Input 共\(n + 1\)个数,分别为\(n\)和\(n\)个数\( ...

  7. Attribute "resultType" must be declared for element type "update" or "insert"

    仔细查看错误如图所示: 解决错误就是把resultType去掉,因为在insert和update语句中是没有返回值的.小坑小坑 转自:https://blog.csdn.net/u013144287/ ...

  8. 【转载】Java反射机制详解

    转自:http://baike.xsoftlab.net/view/209.html#3_8 1反射机制是什么 反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对 ...

  9. MongoDB-2 安装与配置

    安装建议 MongoDB 可以在mac/win/linux上安装,我个人建议在linux上安装会更好,这样测试起来更方便.一般来说本地只装mysql或者MariaDB,其余的中间件一律放linux,让 ...

  10. ModelSerializer，序列化与反序列化整合

    复习 """ 1.解析模块:全局局部配置 REST_FRAMEWORK = { # 全局解析类配置 'DEFAULT_PARSER_CLASSES': [ 'rest_f ...