正常开发中有时间提测比较麻烦。通常让测试小姐姐连接开发本地开启的服务器访问本地项目(在同一局域网下)。

其实一般项目IDE已经实现这些功能例如webstorm和vscode,有时候需要单独配置下。

但是Vue项目在本地开发环境中他们就没办法通过IDE去开启服务器,一般都是是vue-cli脚手架开启服务器的这时候就需要我们做些特别的配置了。

首先需要获取自己的ip,我本人使用mac 在iterm中输入 ifconfig en0 可以拿到自己的IP

inet 10.101.2.43

window系统过通过win+r 输入cmd 打开命令窗口 输入dos命令 ipconfig 即可

然后打开本地项目在根目录找到package.json文件对scripts下的dev在后面加上 --host 10.101.2.43(本地IP)

package.json是这个项目模块的描述文件,scripts对应的是npm脚本命令。例如我们运行项目是 npm run dev

其实执行的是vue-cli-service serve --development --host 10.101.2.43

这样的话我们就可以通过http://10.101.2.43:8083/去访问本地项目(ps:一定是在同意局域网下的)

Vue笔记--同局域网下访问本地项目的更多相关文章

  1. day06-初识Vuetify框架UI框架和使用域名访问本地项目

    本项目的笔记和资料的Download,请点击这一句话自行获取. day01-springboot(理论篇) :day01-springboot(实践篇) day02-springcloud(理论篇一) ...

  2. leyou_02_nginx使用域名访问本地项目

    1.nginx的搭建依赖环境 1.1 准备jdk环境 当前最新版本下载地址:http://www.oracle.com/technetwork/java/javase/downloads/index. ...

  3. XAMPP 虚拟主机配置,实现多域名访问本地项目

    XAMPP 虚拟主机配置,实现多域名访问本地项目 1.首先你既然要配置多个虚拟主机,那你肯定需要多个站点的目录文件.你可以在e盘创建 www文件夹,然后在该文件件中新建两个站点目录,假设test.co ...

  4. Mac设置外网访问本地项目

    > 官网地址:https://ngrok.com/download 步骤(官网基本已经说明了步骤,但还不完善,以下为亲测步骤): 下载并注册账号 打开终端,进入ngrok.zip所在文件夹(方法 ...

  5. 017 使用域名访问本地项目---涉及switchhost和Nginx

    1.统一环境 我们现在访问页面使用的是:http://localhost:9001 实际开发中,会有不同的环境: 开发环境:自己的电脑 测试环境:提供给测试人员使用的环境 预发布环境:数据是和生成环境 ...

  6. 局域网下访问其他计算机搭建的django网页

    1.修改工程目录下的setting.py 文件 ALLOWED_HOSTS = ['*'] #*表示允许访问的ip 如果是添加* 则允许所有同局域网环境的主机访问 2.在完成的django工程下运行以 ...

  7. 用手机或外部设备在同一局域网下访问虚拟主机wampsever的方法版本号是2.4.9

    1,首先在虚拟服务器电脑上可以打开http://localhost/ 2,在外部设备访问时报错为:You don't have permission to access / in on this se ...

  8. Apache虚拟主机配置,实现多域名访问本地项目PHP空间,以及配置403Forbidden等错误的解决办法

    第一步: apache主配置文件修改: 用文本编辑器打开apache的conf目录下 httpd.conf 将下面以下代码取消注释 LoadModule rewrite_module  modules ...

  9. 手机APP应用外网访问本地WEB应用

    手机APP应用外网访问本地WEB应用 本地安装了WEB服务端,手机APP应用只能在局域网内访问本地WEB,怎样使手机APP应用从公网也能访问本地WEB? 本文将介绍具体的实现步骤. 1. 准备工作 1 ...

随机推荐

  1. gzip格式分析与识别

    " 介绍gzip格式,识别gzip压缩的数据流量." 在协议分析过程中,经常会发现gzip压缩的数据,例如在HTTP协议中,在HTTP头中会标示,内容编码为gzip.DEFLATE ...

  2. 【LeetCode】58.最后一个单词的长度

    最后一个单词的长度 给定一个仅包含大小写字母和空格 ' ' 的字符串,返回其最后一个单词的长度. 如果不存在最后一个单词,请返回 0 . 说明:一个单词是指由字母组成,但不包含任何空格的字符串. 示例 ...

  3. SRDC - ORA-1555: Query Duration 0: Checklist of Evidence to Supply (Doc ID 1682704.1)

    SRDC - ORA-1555: Query Duration 0: Checklist of Evidence to Supply (Doc ID 1682704.1) Action Plan 1. ...

  4. [转]5 种使用 Python 代码轻松实现数据可视化的方法

    数据可视化是数据科学家工作中的重要组成部分.在项目的早期阶段,你通常会进行探索性数据分析(Exploratory Data Analysis,EDA)以获取对数据的一些理解.创建可视化方法确实有助于使 ...

  5. [C10] 异常检测(Anomaly Detection)

    异常检测(Anomaly Detection) 问题的动机 (Problem Motivation) 异常检测(Anomaly detection)问题是机器学习算法中的一个常见应用.这种算法的有趣之 ...

  6. 剑指Offer-2.替换空格(C++/Java)

    题目: 请实现一个函数,将一个字符串中的每个空格替换成“%20”.例如,当字符串为We Are Happy.则经过替换之后的字符串为We%20Are%20Happy. 分析: 题意明确,就是将一个字符 ...

  7. ionic4 组件调用的坑

    我们再开发过程中很多模块做成组件,那么调用的时候则需把module.ts中的引入去掉,如下红色框框:

  8. 图像检索——VLAD

    今天主要回顾一下关于图像检索中VLAD(Vector of Aggragate Locally Descriptor)算法,免得时间一长都忘记了.关于源码有时间就整理整理. 一.简介 虽然现在深度学习 ...

  9. python 机器学习基础教程——第一章,引言

    https://www.cnblogs.com/HolyShine/p/10819831.html # from sklearn.datasets import load_iris import nu ...

  10. 代码问题【LDES//AAAI2019】

    paper:Li Y, Zhu J, Hoi S C H, et al. Robust Estimation of Similarity Transformation for Visual Objec ...