Vue 项目关于在生产环境下调试

前言

开发项目时,在本地调试没问题,但是部署到生产会遇到一些很奇怪的问题,本地又没法调,就需要在生产环境/域名下进行调试。

在这里介绍一个插件Vue force dev ,浏览器扩展里下载
即便是设置了Vue.config.devtools=false 只要安装并开启了Vue Force Dev 扩展程序,devtools在生产环境都是可以被轻松打开的。

1 服务代理至本地

当我们在浏览器输入了某个域名网站后,浏览器首先会进行域名解析(也叫DNS解析),以获取对应域名的ip地址,而在系统进行dns解析之前,会首先去hosts文件中查找,在hosts文件中,如果能够找到被访问域名的ip地址,就不会再向dns服务器发起请求。



我们可以在hosts文件设置域名对应的ip, 访问域名的时候指向的是本地项目

我们拿百度举个例子

在hosts文件最后一行加上

127.0.0.1 www.baidu.com

 验证是否成功方法:在cmd中ping一下,如果不对可以电脑重启试下

vue.config文件配置

//webpack 5版本:
devServer: {port: 443,https: true,historyApiFallback: true,allowedHosts: "all"},//webpack 5以下版本:
devServer: {port: 443,https: true,disableHostCheck: true},

我这边在Edge和谷歌(Chrome)浏览器中都可以

2 env环境变量

这是常用的方法,在 Vue 项目中,我们可以使用环境变量来区分生产环境和开发环境。通过在不同环境下加载不同的配置文件或变量,可以直接切到生产环境进行调试。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/229605.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

制作ubuntu上的python容器镜像

制作Ubuntu上的python容器镜像 序言 由于 ubuntu20.04 默认是python3.8,因此3.9需要再安装 拉取镜像基线 docker pull ubuntu:20.04启动容器 docker run -it -e LANGC.UTF-8 ubuntu:20.04安装python 进入容器后安装python包 # 修改 apt源 sed -i shttp://arc…

认知能力测验,③如何破解语言常识类测试题?

作为认知能力测评中的一个环节,语言常识类,是大概率的出现,不同的用人单位可能略有不同,语言是一切的基础,而常识则意味着我们的知识面的宽度。 语言常识类的测试,如果要说技巧?难说....更多的…

zookeeper和nacos区别是什么,注册中心用zookeeper还是nacos

注册中心对比和选型:Zookeeper、Eureka、Nacos、Consul和ETCD zookeeper和nacos区别是什么 Nacos集群raft选举算法原理 Zookeeper和Nacos是两个不同的分布式系统协调组件,它们在设计目标、功能特性和使用方式等方面存在一些区别。以下是它们的主要区别…

c# OpenCV 图像裁剪、调整大小、旋转、透视(三)

图像裁剪、调整大小、旋转、透视图像处理基本操作。 croppedImage 图像裁剪Cv2.Resize() 调整图像大小图像旋转 Cv2.Rotate()旋转Cv2.Flip()翻转Cv2.WarpAffine()任意角度旋转Cv2.GetAffineTransform()透视 一、图像裁剪 // 读取原始图像 Mat image new Mat("1.png&q…

mysql间隙锁,next-key lock,row锁加锁范围分析

介绍 mysql可重复读隔离级别的实现主要依赖mvcc(多版本并发控制)和间隙锁,行锁,多种锁的组合使用来解决可重复读和幻读的问题。 mvcc:主要是给保存每行数据的多个版本,每个版本多了2个字段,一个为最后更新事务的id,一个是删除事务…

maui sqlite开发一个商城加购物车的演示(3)

购物车界面及代码 <?xml version"1.0" encoding"utf-8" ?> <ContentPage xmlns"http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x"http://schemas.microsoft.com/winfx/2009/xaml"xmlns:syncfusion"clr-namesp…

数据修复:.BlackBit勒索病毒来袭,安全应对方法解析

导言&#xff1a; 黑色数字罪犯的新玩具——.BlackBit勒索病毒&#xff0c;近来成为网络安全领域的头号威胁。这种恶意软件以其高度隐秘性和毁灭性而引起广泛关注。下面是关于.BlackBit勒索病毒的详细介绍&#xff0c;如不幸感染这个勒索病毒&#xff0c;您可添加我们的技术服…

ArcMap自定义脚本工具箱迁移至ArcGIS pro

本文记录了将ArcMap10.7创建的自定义脚本工具箱&#xff08;.tbx&#xff09;迁移至ArcGIS pro的过程 ArcGIS Pro使用的是python版本与ArcMap不同&#xff0c;前者为python3&#xff0c;后者为python2。由于python3 和 python2 的部分语法不兼容&#xff0c;以及一些地理处理工…

87 GB 模型种子,GPT-4 缩小版,超越ChatGPT3.5,多平台在线体验

瞬间爆火的Mixtral 8x7B 大家好&#xff0c;我是老章 最近风头最盛的大模型当属Mistral AI 发布的Mixtral 8x7B了&#xff0c;火爆程度压过Google的Gemini。 缘起是MistralAI二话不说&#xff0c;直接在其推特账号上甩出了一个87GB的种子 随后Mixtral公布了模型的一些细节&am…

剑指offer 背包问题求具体方案

剑指offer 背包问题求具体方案 题目 有 N 件物品和一个容量是 V 的背包。每件物品只能使用一次。 第 i 件物品的体积是 vi&#xff0c;价值是 wi。 求解将哪些物品装入背包&#xff0c;可使这些物品的总体积不超过背包容量&#xff0c;且总价值最大。 输出 字典序最小的方…

vue3的大致使用

<template><div class"login_wrap"><div class"form_wrap"> <!-- 账号输入--> <el-form ref"formRef" :model"user" class"demo-dynamic" > <!--prop要跟属性名称对应-->…

华为技面三轮面试题

1. 最长回文子串 -- 中心扩散法 给你一个字符串 s&#xff0c;找到 s 中最长的回文子串。 如果字符串的反序与原始字符串相同&#xff0c;则该字符串称为回文字符串。 示例 1&#xff1a; 输入&#xff1a;s "babad" 输出&#xff1a;"bab" 解释&…

磁力计LIS2MDL开发(3)----九轴姿态解算

磁力计LIS2MDL开发.3--九轴姿态解算 概述视频教学样品申请完整代码下载使用硬件欧拉角万向节死锁四元数法姿态解算双环PI控制器偏航角陀螺仪解析代码 概述 LIS2MDL 包含三轴磁力计。 lsm6ds3trc包含三轴陀螺仪与三轴加速度计。 姿态有多种数学表示方式&#xff0c;常见的是四元…

服务器RAID配置及功能介绍

服务器RAID配置及功能介绍 一、RAID磁盘阵列详解1.RAID磁盘阵列介绍2.RAID 03.RAID14.RAID35.RAID56.RAID67.RAID 10总结阵列卡介绍 一、RAID磁盘阵列详解 1.RAID磁盘阵列介绍 ①是Redundant Array of lndependent Disks的缩写中文简称为独立冗余磁盘阵列。 ②把多块独立的物…

聊聊AsyncHttpClient的ListenableFuture

序 本文主要研究一下AsyncHttpClient的ListenableFuture ListenableFuture org/asynchttpclient/ListenableFuture.java public interface ListenableFuture<V> extends Future<V> {/*** Terminate and if there is no exception, mark this Future as done an…

NBA得分数据可视化

简介 这是上学期的一些课外活动内容&#xff0c;将 NBA 得分数据进行可视化&#xff0c;并进行后续的探索性分析和建模&#xff08;本文未介绍&#xff09;。主要研究动机来源于这篇论文&#xff1a; 该论文使用二元的伽马过程来刻画 NBA 主客场得分数据&#xff0c;并且考虑了…

@RabbitHandler和@RabbitListener的区别

RabbitHandler 和 RabbitListener 是Spring AMQP&#xff08;特别是针对RabbitMQ&#xff09;中常用的两个注解&#xff0c;它们在消息处理中扮演着不同的角色。 RabbitListener 定义&#xff1a;RabbitListener 注解用于标记一个方法&#xff0c;使其成为消息队列的监听器&am…

5.5 Linux Apache服务

1、概念介绍 a. Web 服务简介 WEB服务器也称为WWW(WORLD WIDE WEB&#xff0c;万维网)服务器&#xff0c;主要功能是提供网上信息浏览服务。 常用web服务器&#xff1a;httpd&#xff08;apache&#xff09;、nginx、tomcat、IIS 客户端&#xff1a;IE、firefox、chrome b…

高通平台开发系列讲解(AI篇)SNPE工作流程介绍

文章目录 一、转换网络模型二、量化2.1、选择量化或非量化模型2.2、使用离线TensorFlow或Caffe模型2.3、使用非量化DLC初始化SNPE2.4、使用量化DLC初始化SNPE三、准备输入数据四、运行加载网络沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇章主要介绍SNPE模型工作…

Android终端模拟器Termux上使用Ubuntu

Termux 上安装各种 Linux 系统是通过 proot-distro 工具来实现的&#xff0c;所以先安装一下 proot-distro 工具。 ~ $ pkg install proot-distro 查看Termux支持安装那些Linux ~ $ proot-distro listSupported distributions:* Alpine LinuxAlias: alpineInstalled: noComme…