目前比较流行的打包大都是在vue.config.js配置代理,然后在根目录新建.env.xxx文件配置正式环境,测试环境,开发环境等用于打包时配置不同的访问地址,作为一名随波逐流的前端开发,我也是这么干的,但是总有人很欠,开发中疯狂改ip,然后导致我们要跟着打包,ip的改动导致我们配置的环境根本没有用武之地,于是乎我就想有没有一次打包项目,ip可以让他们开发自己配置,避免重复打包呢?

说做就做,因为原来没有弄过这方面的问题,又这方面的想法,但是没有这方面的开发思路,于是乎百度了一下发现还真有不少人配置过这类开发

看了一遍,总结了一下思路,原理就是在打包的时候将动态的ip排除在打包外,不参与打包,类似于public文件夹下的index.html,

网上的方法大部分都一致在static下新建一个js或json文件在文件里面配置ip地址,然后在拦截器内直接使用,具体使用方法下面讲到,我这边使用的是新建js文件夹,json的我看了一下没有使用,有兴趣的道友可以百度看一下,也许对你有帮助;

项目框架是vue-element-admin

目录结构如下:

在public文件夹下新增config.js,有的项目是static文件夹下,因为我使用的是vue-element-admin模板所以是public

新建一个对象

在pubulic文件夹下的index.html引入此文件,在项目中就可以使用了

然后去拦截器内直接调用对象

然后就可以啦,是不是很简单0.0

本文出自于https://www.cnblogs.com/sws-kevin/p/14237428.html 转载请注明出处,否则会追究。

vue 动态ip配置,避免重复打包的更多相关文章

  1. 二、Linux 静态IP,动态IP配置

    Linux 静态IP,动态IP配置 第一步:激活网卡 系统装好后默认的网卡是eth0,用下面的命令将这块网卡激活. # ifconfig eth0 up 第二步:设置网卡进入系统时启动 想要每次开机就 ...

  2. cdnbest节点动态ip配置教程

    1.安装节点后,在未初始化里初始化节点,如下图操作,要选择动态ip(注:动态ip节点不支持添加辅ip) 服务器如果是动态ip,选择了动态ip选项,节点在自动更换了新的ip后,在节点列表里的ip和dns ...

  3. vue动态路由配置,vue路由传参

    动态路由: 当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据 这就要用到动态路 ...

  4. vue cli2.x配置多环境打包

    一.安装 npm install --save-dev cross-env 二.配置步骤 1.修改config下的文件 //test.env.js 'use strict' module.export ...

  5. 02.centos6.4找不到ifcfg-eth0(静态ip配置)

    1.默认情况在/etc/sysconfig/network-scripts/目录下面找不到ifcfg-eth0文件,我们需要手动copy 1.1动态ip配置 #cp ifcfg-lo ifcfg-et ...

  6. 在 Windows Azure 网站中配置动态 IP 地址限制

    我们最近对 Windows Azure 网站进行了升级,并启用了IIS8的动态 IP 限制模块.现在,开发人员可以为其网站启用并配置动态 IP 限制功能(或简称 DIPR). 可以通过以下链接查看此 ...

  7. <TCP/IP>DHCP动态主机配置协议

    坚持是一种好习惯 大家都知道,为了上网我们是需要提交一些配置信息的,如IP地址,子网掩码,DNS服务器等,这些是一个主机能够在Internet上运行并给用户提供常用服务(比如web和Email)的基本 ...

  8. win10配置的静态/动态IP和 DNS的方法

    1.配置静态IP和DNS netsh interface ip set address name="以太网" source=static addr=192.168.9.145 ma ...

  9. CentOS 7运维管理笔记(11)----解决配置静态IP还是会出现动态IP地址的问题

    网上搜集CentOS7 配置静态IP的方法,基本上都是说在 /etc/sysconfig/network-scripts/ifcfg-eth0文件中做如下配置 TYPE=Ethernet HWADDR ...

随机推荐

  1. docker容器存储

    写在前面 我们在上篇学习了容器网络,对容器网络驱动bridge工作原理做了较为详细的介绍,今天小作文一起看看容器中另一个关键域-存储. 容器的存储可以分为两大类: 一种是与镜像相关的即我们在<d ...

  2. MOOC大学计算机课程推荐

    转自:https://zhuanlan.zhihu.com/p/30659834  这个是大佬总结的, 大学计算机课程 以下课程是我在MOOC上找到的所有我认为讲的好的. 主要是中国大学MOOC,学堂 ...

  3. Git-02-版本回退

    环境准备 1 修改readme.txt内容 Git is a distributed version control system. Git is free software. 2 git statu ...

  4. 官宣 .NET 6 预览版 6

    我们很高兴宣布.NET 6 预览版6问世啦.预览版6 是我们RC版发布之前的倒数第二个预览版. 我们将有两个RC版. 此版本本身相对较小,而预览版7会更大. 在那之后,我们将进行质量修复,直到11 月 ...

  5. 初探 Python Flask+Jinja2 SSTI

    初探 Python Flask+Jinja2 SSTI 文章首发安全客:https://www.anquanke.com/post/id/226900 SSTI简介 SSTI主要是因为某些语言的框架中 ...

  6. BUUCTF刷题系列(1)5.25日记

    前面的题目都不太难,就直接从SQL注入开始了. 这个样子的话,明显就是注入,我们先拿出SQL语句:http://fb415201-6634-4fc3-a6bc-a67b84ea1ed2.node3.b ...

  7. SQL 练习9

    查询学过「张三」老师授课的同学的信息 SELECT Student.* from Student,Teacher,Course,SC WHERE Teacher.TId = Course.TId AN ...

  8. Freemarker基本语法

    一.概念 Freemarker是一款模板引擎,并用来输出文本,网页或配置文件等. 二.语法 2.1 注释 <!-- 在页面可以看的到 --> <#-- 在页面看不到 --> 2 ...

  9. 利用pycharm创建DjangoWeb项目

    1.打开pycharm开发工具:(开发服务器的搭建) File------->New Project-------->Django()

  10. Qt Model/View(模型/视图)结构(无师自通)

    Model/View(模型/视图)结构是 Qt 中用界面组件显示与编辑数据的一种结构,视图(View)是显示和编辑数据的界面组件,模型(Model)是视图与原始数据之间的接口. GUI 应用程序的一个 ...