vue引用外部JS的两种种方法


Posted in Javascript onJanuary 28, 2020

前言

肯定会遇到没有npm化的库

自己写的js 方法

在Vue中该怎么引用呢

第一种 如果库是es6写的 就可以用import 引入

比如我自己写的http 封装接口的方法

vue引用外部JS的两种种方法 

就可以这样子导入哦

vue引用外部JS的两种种方法 

第二种是jquery的库 可以在静态资源导入(或者是cdn资源加载)

vue引用外部JS的两种种方法 

我是vue-cli 3.0 基础之上架构的

把squire这个富文本框放进public文件下面 在index.html中这样子引用

vue引用外部JS的两种种方法 

Fannie式总结

自己封装方法 就采用es6方法 这样方便

第三方原生js 或者是jq的插件

直接cdn 这种也是可以的哦 或者是静态资源加载 但是也要注意cdn这个链接资源的稳定性

ps:下面看下Vue.js 引入外部js方法

1、外部文件config.js

第一种写法

//常量的定义
const config = {
 baseurl:'http://172.16.114.5:8088/MGT2'
}
//函数的定义
function formatXml(text) {
return text
}
//导出 {常量名、函数名}
export {config,formatXml}

第二种写法

//常量的定义
export const config = {
 baseurl:'http://172.16.114.5:8088/MGT2'
}
//函数的定义
export function formatXml(text) {
return text
}

2、引入config.js里面的常量和方法

import {config,formatXml} from '../config'//记得带上{}花括号

总结

以上所述是小编给大家介绍的vue引用外部JS的两种种方案,希望对大家有所帮助!

Javascript 相关文章推荐
Js如何判断客户端是PC还是手持设备简单分析
Nov 22 Javascript
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
Jul 03 Javascript
js向上无缝滚动,网站公告效果 具体代码
Nov 18 Javascript
javascript设计模式之工厂模式示例讲解
Mar 04 Javascript
jQuery EasyUI 布局之动态添加tabs标签页
Nov 18 Javascript
Vue.js实战之利用vue-router实现跳转页面
Apr 01 Javascript
Angular.js中angular-ui-router的简单实践
Jul 18 Javascript
vue2.0移除或更改的一些东西(移除index key)
Aug 28 Javascript
基于vue-resource jsonp跨域问题的解决方法
Feb 03 Javascript
Vue中的vue-resource示例详解
Nov 02 Javascript
vue双向绑定数据限制长度的方法
Nov 04 Javascript
Vue Object 的变化侦测实现代码
Apr 15 Javascript
Java Varargs 可变参数用法详解
Jan 28 #Javascript
关于引入vue.js 文件的知识点总结
Jan 28 #Javascript
JS简单表单验证功能完整示例
Jan 26 #Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 #Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
Jan 26 #Javascript
vue跳转方式(打开新页面)及传参操作示例
Jan 26 #Javascript
详解Vue的ref特性的使用
Jan 24 #Javascript
You might like
比特率,大家看看这个就不用收音机音质去比MP3音质了
2021/03/01 无线电
PHP计算日期相差天数实例分析
2016/02/23 PHP
基于Jquery的动态创建DOM元素的代码
2010/12/28 Javascript
javascript中的document.open()方法使用介绍
2013/10/09 Javascript
javascript实用小函数使用介绍
2013/11/11 Javascript
js查找某元素中的所有图片地址的方法
2014/01/16 Javascript
如何正确使用Nodejs 的 c++ module 链接到 OpenSSL
2014/08/03 NodeJs
jQuery源码分析之jQuery.fn.each与jQuery.each用法
2015/01/23 Javascript
javascript 常见功能汇总
2015/06/11 Javascript
jQuery动画显示和隐藏效果实例演示(附demo源码下载)
2015/12/31 Javascript
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
原生JS封装Ajax插件(同域、jsonp跨域)
2016/05/03 Javascript
JS实现留言板功能[楼层效果展示]
2017/12/27 Javascript
javaScript强制保留两位小数的输入数校验和小数保留问题
2018/05/09 Javascript
微信小程序开发注意指南和优化实践(小结)
2019/06/21 Javascript
详解webpack-dev-middleware 源码解读
2020/03/23 Javascript
Python中的匿名函数使用简介
2015/04/27 Python
python在Windows下安装setuptools(easy_install工具)步骤详解
2016/07/01 Python
关于python写入文件自动换行的问题
2018/06/23 Python
从请求到响应过程中django都做了哪些处理
2018/08/01 Python
python数据结构之线性表的顺序存储结构
2018/09/28 Python
如何使用Python标准库进行性能测试
2019/06/25 Python
Django admin model 汉化显示文字的实现方法
2019/08/12 Python
python+selenium 点击单选框-radio的实现方法
2019/09/03 Python
python将下载到本地m3u8视频合成MP4的代码详解
2020/11/24 Python
英国泰坦旅游网站:全球陪同游览,邮轮和铁路旅行
2016/11/29 全球购物
亚洲颇具影响力的男性在线购物零售商:His
2019/11/24 全球购物
什么是数据库锁?Oracle中都有哪些类型的锁?
2015/08/21 面试题
农村婚礼证婚词
2014/01/08 职场文书
档案室主任岗位职责
2014/02/12 职场文书
《春笋》教学反思
2014/04/15 职场文书
世界读书日的活动方案
2014/08/20 职场文书
2014年党员整改措施
2014/10/24 职场文书
汉字听写大会观后感
2015/06/12 职场文书
2016年秋季运动会通讯稿
2015/11/25 职场文书
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android