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 相关文章推荐
DOM 脚本编程中的兄弟节点
Oct 31 Javascript
JavaScript 利用Cookie记录用户登录信息
Dec 08 Javascript
基于jQuery试卷自动排版系统
Jul 18 Javascript
javascript之典型高阶函数应用介绍
Jan 10 Javascript
node.js中的path.delimiter方法使用说明
Dec 09 Javascript
纯JS实现旋转图片3D展示效果
Apr 12 Javascript
微信小程序云开发之模拟后台增删改查
May 16 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
Sep 10 Javascript
Vue v-text指令简单使用方法示例
Sep 19 Javascript
vue轮播组件实现$children和$parent 附带好用的gif录制工具
Sep 26 Javascript
js验证账户名是否重复
May 26 Javascript
ReactRouter的实现方法
Jan 25 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
国内php原创论坛
2006/10/09 PHP
ThinkPHP后台首页index使用frameset时的注意事项分析
2014/08/22 PHP
ThinkPHP控制器里javascript代码不能执行的解决方法
2014/11/22 PHP
php实现爬取和分析知乎用户数据
2016/01/26 PHP
PHP中静态变量的使用方法实例分析
2016/12/01 PHP
Javascript 二维数组
2009/11/26 Javascript
jQuery 源码分析笔记(3) Deferred机制
2011/06/19 Javascript
20行代码实现的一个CSS覆盖率测试脚本
2013/07/07 Javascript
jquery cookie的用法总结
2013/11/18 Javascript
常规表格多表头查询示例
2014/02/21 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
JavaScript实现多个重叠层点击切换效果的方法
2015/04/24 Javascript
JS折半插入排序算法实例
2015/12/02 Javascript
JavaScript实现定时页面跳转功能示例
2017/02/14 Javascript
JS实现浏览器打印、打印预览示例
2017/02/28 Javascript
详解Vue2.X的路由管理记录之 钩子函数(切割流水线)
2017/05/02 Javascript
bootstrap里bootstrap动态加载下拉框的实例讲解
2018/08/10 Javascript
使用vue-cli3 创建vue项目并配置VS Code 自动代码格式化 vue语法高亮问题
2019/05/14 Javascript
jQuery+ajax实现批量删除功能完整示例
2019/06/06 jQuery
举例区分Python中的浅复制与深复制
2015/07/02 Python
python文件名和文件路径操作实例
2017/09/29 Python
pycharm重置设置,恢复默认设置的方法
2018/10/22 Python
tensorflow对图像进行拼接的例子
2020/02/05 Python
使用python-Jenkins批量创建及修改jobs操作
2020/05/12 Python
css3学习之2D转换功能详解
2016/12/23 HTML / CSS
印度手工编织服装和家居用品商店:Fabindi
2019/10/07 全球购物
捷克家具销售网站:SCONTO Nábytek
2020/01/02 全球购物
接口可以包含哪些成员
2012/09/30 面试题
公司综合部的成员自我评价分享
2013/11/05 职场文书
生产现场工艺工程师岗位职责
2013/11/28 职场文书
加多宝凉茶广告词
2014/03/18 职场文书
《雪儿》教学反思
2014/04/17 职场文书
汽车运用工程专业求职信
2014/06/18 职场文书
行政处罚听证告知书
2015/07/01 职场文书
2016继续教育研修日志
2015/11/13 职场文书
浅谈vue2的$refs在vue3组合式API中的替代方法
2021/04/18 Vue.js