位置: IT常识 - 正文

如何让别人访问本地运行的vue项目(如何让别人访问自己的qq空间)

编辑:rootadmin
这篇文章主要介绍了如何让别人访问本地运行的vue项目,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教 目录

推荐整理分享如何让别人访问本地运行的vue项目(如何让别人访问自己的qq空间),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:如何让别人访问自己的qq空间,如何让别人访问自己的ip地址,如何让别人访问自己的数据库,如何让别人访问自己的数据库,如何让别人访问看不到情侣空间标识,如何让别人访问我的本地网站,如何让别人访问自己的ip地址,自己做的网页如何让别人访问,内容如对您有帮助,希望把文章链接给更多的朋友!

让别人访问本地运行的vue项目1. 修改vue项目中config文件下的index.js2. window + R输入cmd调出控制台3. 在控制面板中搜索防火墙并关闭防火墙本地运行打包后的vue项目打包测试(搭建服务器)让别人访问本地运行的vue项目1. 修改vue项目中config文件下的index.js

将host: "localhost" 改为 host: "0, 0, 0, 0"

2. window + R输入cmd调出控制台

在控制台中输入 ipconfig 找到电脑的IP地址

3. 在控制面板中搜索防火墙并关闭防火墙

然后其他人就可以通过你的ip地址+端口号访问了。

本来你是localhost:8080这样的。现在改成192.1.2.3:8080就行了

注意:需要在同一网络环境下进行访问,例如,连同一个wifi,或者连接同一个路由器的宽带

本地运行打包后的vue项目打包测试(搭建服务器)如何让别人访问本地运行的vue项目(如何让别人访问自己的qq空间)

打包后的代码必须放在服务器下才能运行,直接双击index.html是不行的。

下面介绍一种利用node.js的 http-server搭建一个简单的http服务器:那么什么是http-server呢?http-server是一个基于node.js的简单的,零配置的命令行http服务器。

(1) 安装

既然是基于node的,首先必须安装node.js,这个略过不谈。全局安装 http-server,这样就可以在任意一个本地项目中使用了。

npm install http-server -g

(2) 使用

http-server [path] [options]

path选项说明

如果指定path,即为指定的路径,如果不指定,即为当前所在文件路径。强烈建议直接在vue-cli打包后的dist文件夹下打开命令行,这样就不用再指定文件路径了。或者直接指定路径为dist

http-server ./dist

options选项说明

下面介绍几个常用的:

-p 要使用的端口(默认为8080);-o 启动服务器后打开浏览器窗口;-P 或 --proxy代理不能在本地解析给定的url的所有请求;-S 或 --ssl启用https;

http-server默认启用8080端口,但是这个端口容易和电脑中的某些任务冲突,强烈建议利用-p 端口号指定一个新的端口。如果你想同时开启两个项目,则两个项目必须指定不同的端口号,否则有一个项目是打不开的。

你的项目的请求接口是跨域的,不能直接访问。如何解决跨域这个问题呢?添加-P 域名地址即可。这个P是大写的,上面端口那个p是小写的。请注意区分!

例如,我的启动服务器的命令即:

http-server -p 8081 -o -P http://www.baidu.com

(3) 注意

按照正常情况来说,这时会自动打开浏览器,渲染出你的项目。可是,在打包测试时,还发现了一些其他问题。

1.有时候打包运行时发现一片空白,这可能就是打包后的css/js的引入问题了。默认的引入方式是绝对路径方式。我们希望是相对路径,可以把config/index.js中的assetsPublicPath: ‘/’,改为assetsPublicPath: ‘./’,这样再打包出来的就是相对路径了。

assetsPublicPath: '/',  // 绝对路径assetsPublicPath: './', // 相对路径

2.运行打包后的项目时,在非首页页面刷新时直接404,如果你的项目出现这个问题,那么你的router中一定是把mode定义为history了。定义hash模式则不会出这个问题。难道只能用很丑的hash?当然不是,其实vue-router官方文档的HTML5 History 模式对此已有说明,这个就需要后端的帮我们设置一下了。

以上为个人经验,希望能给大家一个参考,也希望大家多多支持本站。

本文链接地址:https://www.jiuchutong.com/zhishi/304044.html 转载请保留说明!

上一篇:MSN中国男人频道采集规则For DedeCMS v5.5(中国男人百度百科)

下一篇:python HTML测试报告的用法(python htmltestrunner报告)

  • 中国电信10010余额怎么自助查询(中国电信10010余额怎么自助查询四川省电)

    中国电信10010余额怎么自助查询(中国电信10010余额怎么自助查询四川省电)

  • word封面下划线怎么设置一样长(word封面下划线上写字)

    word封面下划线怎么设置一样长(word封面下划线上写字)

  • 华为荣耀20和v20一样吗(华为荣耀20和v20哪个好)

    华为荣耀20和v20一样吗(华为荣耀20和v20哪个好)

  • 华为nova5z支持电信4g吗(华为nova5z支持电信4g频段)

    华为nova5z支持电信4g吗(华为nova5z支持电信4g频段)

  • 苹果手机虚拟专用网络什么意思(苹果手机虚拟手机软件)

    苹果手机虚拟专用网络什么意思(苹果手机虚拟手机软件)

  • 飞利浦理发器拆卸步骤(飞利浦理发器拆解)

    飞利浦理发器拆卸步骤(飞利浦理发器拆解)

  • 300dpi是多少ppi(300dpi是多少像素尺寸)

    300dpi是多少ppi(300dpi是多少像素尺寸)

  • 苹果11可否用充电宝(苹果11可以充电玩手机吗)

    苹果11可否用充电宝(苹果11可以充电玩手机吗)

  • 相册里的视频一直缓冲(相册里的视频一直转圈)

    相册里的视频一直缓冲(相册里的视频一直转圈)

  • 为什么cad复制粘贴不了到另一个文件(为什么CAD复制粘贴之后坐标变大了)

    为什么cad复制粘贴不了到另一个文件(为什么CAD复制粘贴之后坐标变大了)

  • psn是什么意思(原神绑定psn是什么意思)

    psn是什么意思(原神绑定psn是什么意思)

  • 优酷会员号在哪里看(优酷的会员账号从哪儿看)

    优酷会员号在哪里看(优酷的会员账号从哪儿看)

  • 拼多多助力是什么意思(拼多多助力是什么原理)

    拼多多助力是什么意思(拼多多助力是什么原理)

  • 红米k30pro重量多少克(红米k30pro重量厚度)

    红米k30pro重量多少克(红米k30pro重量厚度)

  • iphone11pro max屏幕刷新率(iphone11pro max屏幕像素)

    iphone11pro max屏幕刷新率(iphone11pro max屏幕像素)

  • qq的pddata是什么文件

    qq的pddata是什么文件

  • 爱奇艺零流量传视频在哪里(爱奇艺零流量传片2022)

    爱奇艺零流量传视频在哪里(爱奇艺零流量传片2022)

  • 12306积分不够可以补钱吗(12306积分不够可以买半程票吗)

    12306积分不够可以补钱吗(12306积分不够可以买半程票吗)

  • 手机qq名片怎么弄空白(手机qq名片怎么变成透明)

    手机qq名片怎么弄空白(手机qq名片怎么变成透明)

  • word无法编辑怎么解决(word无法编辑怎么设置)

    word无法编辑怎么解决(word无法编辑怎么设置)

  • 美图秀秀怎么删作品(美图秀秀怎么删除视频前面部分)

    美图秀秀怎么删作品(美图秀秀怎么删除视频前面部分)

  • 一闪怎么添加音乐(一闪怎么加录音)

    一闪怎么添加音乐(一闪怎么加录音)

  • 抖音发视频怎么加文字(抖音发视频怎么上热门)

    抖音发视频怎么加文字(抖音发视频怎么上热门)

  • python中使用动量交易策略(python动态参数应用)

    python中使用动量交易策略(python动态参数应用)

  • 购买财务软件的会计分录怎么做
  • 带薪年休假如果当年离职补交的年休假钱需要扣个税嘛
  • 征地补偿费谁来支付
  • 其他应付款短期借款
  • 核定征收可以改查账征收吗
  • 自然灾害造成的房屋损失怎么处理
  • 工程总包如何开具发票和征税
  • 留抵进项税额
  • 企业间无偿划转会计分录
  • 公司改变工资结构变相降工资怎么办
  • 餐饮刷卡机手续费多少
  • 自然人能申请破产吗?
  • 通用机打发票税率在哪改
  • 租金可以抵税吗
  • 发票未到的费用怎么处理
  • 存货跌价准备可以转回吗?
  • 联想旧电脑怎么连接wifi
  • 为什么手机连不上热点
  • 公务接待和商务接待自查
  • 企业纳税申报的流程
  • 项目单位自筹资金
  • iis配置mime
  • ubuntu22.04更换RTX 4090显卡后,安装驱动和pytorch记录
  • 建筑业预缴企业所得税税率是多少
  • deepin 设置
  • Mail.app增强插件:Universal Mailer介绍
  • 红掌的养殖方法和注意事项
  • 跨境服务免征增值税需要一直备案吗
  • 浅谈特殊儿童的融合教育论文
  • php umask
  • 长期借款利息的会计科目
  • 财务费用是一种期间费用,按期归集
  • 政府收购企业的补偿款要交税吗
  • re.findall()用法
  • 无纸化办理
  • 预训练的目的
  • 知识图谱实现方案
  • javascript中文手册
  • mysql中regexp_instr函数的使用
  • 公司主营业务和经营范围的区别
  • 税盘显示已反写
  • 年度财务报表分为哪几类
  • mysql查询性能优化
  • mysql查询表里数据
  • 加计扣除所得税处理
  • 经销商会议是什么意思
  • 运费和什么有关
  • sql数据库聚集索引和非聚集索引的区别是什么?
  • 加强mysql安全
  • 软件开发并销售产品
  • 融资租赁开具的发票内容
  • 个体工商户的个税起征点
  • 资本性支出是什么活动
  • 建筑 营改增
  • 以现金支付办公用品费440元
  • winXP系统还能用吗
  • solaris命令
  • centos 安装
  • freebsd操作命令
  • 电脑xp系统桌面
  • mac的itunes怎么用
  • windows设备和打印机
  • windows8设置
  • Cocos2dx 3.2 + vs2012 + win7 改变面黑色背景的大小
  • 开快打开
  • css中的auto
  • r语言和python画图
  • listview的item
  • 批处理 !!
  • Errors running builder 'Android Resource Manager' on Project java.lang.NullPointerException
  • 手游开发商和发行商有哪些
  • js封装是什么意思
  • 浅谈一下新冠的好处
  • android 获取时区
  • 已抵扣过进项税额的固定资产改变用途
  • 税务局查帐流程
  • 娱乐会所一般有什么
  • 税务局调查巡查政策依据
  • 服务礼仪包括哪三点
  • 股东非自然人
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设