Vue引入非npm的js库
Vue项目有时候需要一些没有使用export的js库,不能通过import * from ./***"引入,那么可以有如下方法如下
1.可以在index.html页面使用script标签引入,当然也可以使用cdn的地址。这样引入后的内容是全局的,可以在所有地方使用
<!DOCTYPE html>
<html>
<head>
<title>Map</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="shortcut icon" type="image/x-icon" href="./static/img/favicon.ico"/>
<script src='./static/libs/three/three.min.js'></script>
<script src="./static/libs/three/GLTFLoader.js"></script>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
2.在main.js中使用window.moduleName 使用
也可以放入Vue.prototype中,这样组件内都可以使用。
var THREE = window.THREE
var GLTFLoader = THREE.GLTFLoader
Vue.prototype.THREE = THREE
3.手动添加export的方式
为js库中需要使用的方法放入export default { /**要导出的方法**/},然后通过import {*} from 使用
4. 直接使用import 'url' 方式,把需要的js库中的方法挂载到全局,如下:
import '@static/libs/GLTFLoader'
// 可以从全局获取导入的方法
let GLTFLoader = THREE.GLTFLoader
Vue引入非npm的js库的更多相关文章
- vue引入自己写的js文件
话不多说,直接上代码呀~ 先来个结构图: 中规中矩的vue-cli就写了一个自己的js文件 那么我想要引入到vue组件里. 1.首先写我的js文件 2.引入到vue组件!!!一定要用{}把方法名拿过来 ...
- vue引入iconfont阿里字体图标库以及报错解决
下载阿里的字体图标库文件,放在\src\assets\font文件夹下面. 安装style-loader,css-loader和file-loader (或url-loader) ,记得--save ...
- babel配置项目目录支持转换es6语法,引入非项目目录js后,引入Js转换无效
我遇到了一个问题,我在已经配置babel的项目中通过require引入了一个项目目录外层的另一个js文件,前期是可以成功转换并打包的,但是到了后期就不行了,报错: 这个报错的意思是,引入的js文件中有 ...
- vue引入外部css和js
<template> <div id="app" > </div> </template> <script src=" ...
- 前端之Vue.js库的使用
vue.js简介 Vue.js读音 /vjuː/, 类似于 view Vue.js是前端三大新框架:Angular.js.React.js.Vue.js之一,Vue.js目前的使用和关注程度在三大框架 ...
- 16、vue引入echarts,划中国地图
vue引入echarts npm install echarts --save main.js引入 import echarts from 'echarts' Vue.prototype.$echar ...
- 必备技能六、Vue框架引入JS库的正确姿势
在Vue.js应用中,可能需要引入Lodash,Moment,Axios,Async等非常好用的JavaScript库.当项目变得复杂庞大,通常会将代码进行模块化拆分.可能还需要跑在不同的环境下,比如 ...
- Vue引入第三方JavaScript库和如何创建自己的Vue插件
一 第三方JavaScript库 前言 .vue文件 中不解析 script标签引入js文件,只能用 import 引入 有两种用法: 1.import a from '../a' 2.import ...
- 在Vue将第三方JS库封装为组件使用
第三方JS库地址:https://github.com/inorganik/CountUp.js 使用NPM进行安装: npm install --save countup 根据官方回答,CountU ...
随机推荐
- prometheus+grafana监控mysql
prometheus+grafana监控mysql 1.安装配置MySQL官方的 Yum Repository(有mysql只需设置监控账号即可) [root@localhost ~]# wget - ...
- 微信小程序页面滚动到指定位置
页面上有一个元素或者组件,id 为 comment 则: var me = this; var query = wx.createSelectorQuery().in(me); query.selec ...
- Once in a casino CodeForces - 1120B (暴力)
大意: 给定两个字符串$a,b$, 每个字符为$0-9$, 每次操作将$a$中相邻两位加$1$或减$1$, 操作后每个数仍要为$0-9$, 求最少操作使$a$变成$b$. 先不考虑范围, 判断是否成立 ...
- Board Game CodeForces - 605D (BFS)
大意: 给定$n$张卡$(a_i,b_i,c_i,d_i)$, 初始坐标$(0,0)$. 假设当前在$(x,y)$, 若$x\ge a_i,y\ge b_i$, 则可以使用第$i$张卡, 使用后达到坐 ...
- RMAN执行crosscheck archive报错ORA-19633问题处理
一.问题现象 RMAN connect target /; run { crosscheck archivelog all; } ORA-: control file record is out of ...
- (二)ActiveMQ之点对点消息实现
一.点对点消息实现概念 在点对点或队列模型下,一个生产者向一个特定的队列发布消息,一个消费者从该队列中读取消息.这里,生产者知道消费者的队列,并直接将消息发送到消费者的队列.这种模式被概括为:只有一个 ...
- 通过SQL Server的扩展事件来跟踪SQL语句在运行时,时间都消耗到哪儿了?
原文:通过SQL Server的扩展事件来跟踪SQL语句在运行时,时间都消耗到哪儿了? 问题就是,一个很简单的语句,在不同的服务器上执行,所需要的时间相差很大,特别提到在性能差的服务器上反而快,在性能 ...
- D盘Program Files 文件夹里文件不显示,没隐藏。怎么才能显示出来?
D盘里有两个一模一样的Program Files 文件夹,文件夹里文件不显示,没隐藏.怎么才能显示出来?新买不久的电脑,win8.1系统 点击开始---运行---输入“cmd”(没有引号)---在弹出 ...
- 最快得到MYSQL两个表的差集
Mysql里不外乎就是 子查询 和 连接 两种方式. 设第一个表为table1, 第二个为table2, table1包含table2. sql为: //子查询 select table1.id fr ...
- 安装Nvida 显示环境
查看是否能正确加载nvidia 驱动 在终端输入 (glxinfo 需要安装mesa-utils) 如果可以正确加载了nvidia驱动 那么在输入的内容中可以看到NVIDIA 字样 如果GPU是Int ...