前端vue如何引用外部文件接口,减少实施人员的打包

估计很多刚入门的前端小伙伴都会遇到这样的问题:
项目上线了,但是有时候我们会给客户升级,客户是N多家,有的客户使用云服务,但也有一部分使用本地话部署,这就导致实施更新前端包的时候很苦恼:改一个请求地址打一次前端包,好浪费时间呀!!
废话少说,直接进入正题...
为了减少实施人员工作量,我们把项目调用接口地址的前缀配置到静态文件夹static下

1、创建一个JSON文件

2、把对应的接口写到JSON文件

3、在main.js引入

主意:确保启动之后才能请求数据,要在实例化之前拿到配置的参数

4、当然,除了前端做好这些之外,还要实施人员在服务器工程同级文件夹新建一个static文件夹,用来放置上面提到json文件,这样,实施人员就可以方便修改个个环境的地址啦

我也是参考其他前辈的经验来做的,但是貌似提到的很少,所以,我就索性当做笔记来写了,我只是个小白,希望大神们可以指出我的不对,我会努力改进的~~

原文地址:https://www.cnblogs.com/zcjun-cnblogs/p/12069946.html

时间: 2024-09-30 02:01:32

前端vue如何引用外部文件接口,减少实施人员的打包的相关文章

前端 - js、css外部文件的相对路径问题

如果js.css外部文件有使用到相对路径时,需要注意其相对路径的基准是不一样的. 比如说,在index.html中引用到了外部的js和css文件,这两个文件都通过相对路径引用了某一张图片:这些文件所在的目录如下: . ├── js | └── index.js ├── css | └── index.css ├── images | └── bg.jpg └── index.html js文件的相对路径是以引用该js文件的页面为基准,所以在js文件中的相对路径是: function change

vue中引入外部文件js、css、img的方法

第一种方法,直接放到相对路径下,位置:./static/js/main.js,./static/css/main.css,./static/img/test.png 第二种方式: ES6的import方式引入,被引入文件test.js尾部加入 export default {    fn   }  //fn是被引入的方法:在main.js引入  import test from './assets/js/test.js'       Vue.prototype.$test= test; 全局引入

vue,vuex的后台管理项目架子structure-admin,后端服务nodejs,前端vue页面

之前写过一篇vue初始化项目,构建vuex的后台管理项目架子,这个structure-admin-web所拥有的功能 1.vuex来实现状态管理 2.静态页面,未引入后端服务 3.组件是用的是element-ui 4.页面布局是上左右,左右布局使用的弹性和布局flex,左边定宽,右边计算宽度 5.左右的滚动条是相互独立的,去掉body上的滚动条 6.没有业务代码,仅仅是一个静态的vuex的架子 说明:之前使用左侧menu的fixed布局,发现element-ui的弹窗组件不能正常显示,考虑换成f

引用公用文件

1.PHP 中引用外部文件 <?php require "include/header.inc.php"; ?> 2.引用公用CSS: 3.引用公用文件: 4.给引用文件授权: 方法: range() 函数创建并返回一个包含指定范围的元素的数组. <?php $number = range(0,50,10); print_r ($number); ?> //输出: Array ( [0] => 0 [1] => 10 [2] => 20 [3]

有用的javascript外部文件或其他外部文件引用

原文:有用的javascript外部文件或其他外部文件引用 1.<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css' /><!--引入谷歌字体API--> 2.<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs

Ant入门之引用外部jar文件

笔者在java项目开发中经常遇到引用外部Jar包的情况,使用ant打包过程中需要对其引用.现在此简单记忆以飨来者. 此处引用Log4j,具体程序HelloLog4j.java: package oata; import org.apache.log4j.Logger; import org.apache.log4j.BasicConfigurator; public class HelloLog4j { static Logger logger = Logger.getLogger(HelloL

引用外部.css或.js文件的路径问题

转载自:http://www.blogjava.net/Johnny-Ajun/archive/2011/06/16/352440.html jsp或html页面引用外部.css或.js文件时,注意路劲问题,如果设置不当,会引用不到这些外部的文件假设使用下面的目录结构: -webapp |-MyProject  目录  |--WebContent 目录  |---scripts 目录   ---dtree.js 文件  |---styles 目录   ---main.css 文件   |---p

动态引用外部的Javascript脚本文件[转]

你可以参考下面方法,进行动态为网页引用外部的Javascript脚本文件.代码写在Page_Init方法内. VB.NET: 下图是运行时,查看HTML的源代码: C#:

ASP.NET中母版页引用外部js或css文件无效,提示对象未定义解决方法

最近做网站用了一个js+css实现的带有二级菜单的导航条,在母版页创建好后,子页面调用出现了许多奇怪的问题,多方查证后的最终解决方案和大家分享下.... 1.路径问题 如果是一个单独的aspx页面调用此文件路径会是 1 <link type="text/css" rel="stylesheet" href="navigator/css/shou.css" /> 2 <script type="text/javascri