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库的更多相关文章

  1. vue引入自己写的js文件

    话不多说,直接上代码呀~ 先来个结构图: 中规中矩的vue-cli就写了一个自己的js文件 那么我想要引入到vue组件里. 1.首先写我的js文件 2.引入到vue组件!!!一定要用{}把方法名拿过来 ...

  2. vue引入iconfont阿里字体图标库以及报错解决

    下载阿里的字体图标库文件,放在\src\assets\font文件夹下面. 安装style-loader,css-loader和file-loader (或url-loader)  ,记得--save ...

  3. babel配置项目目录支持转换es6语法，引入非项目目录js后，引入Js转换无效

    我遇到了一个问题,我在已经配置babel的项目中通过require引入了一个项目目录外层的另一个js文件,前期是可以成功转换并打包的,但是到了后期就不行了,报错: 这个报错的意思是,引入的js文件中有 ...

  4. vue引入外部css和js

    <template> <div id="app" > </div> </template> <script src=" ...

  5. 前端之Vue.js库的使用

    vue.js简介 Vue.js读音 /vjuː/, 类似于 view Vue.js是前端三大新框架:Angular.js.React.js.Vue.js之一,Vue.js目前的使用和关注程度在三大框架 ...

  6. 16、vue引入echarts，划中国地图

    vue引入echarts npm install echarts --save main.js引入 import echarts from 'echarts' Vue.prototype.$echar ...

  7. 必备技能六、Vue框架引入JS库的正确姿势

    在Vue.js应用中,可能需要引入Lodash,Moment,Axios,Async等非常好用的JavaScript库.当项目变得复杂庞大,通常会将代码进行模块化拆分.可能还需要跑在不同的环境下,比如 ...

  8. Vue引入第三方JavaScript库和如何创建自己的Vue插件

    一 第三方JavaScript库 前言 .vue文件 中不解析 script标签引入js文件,只能用 import 引入 有两种用法: 1.import a from '../a' 2.import ...

  9. 在Vue将第三方JS库封装为组件使用

    第三方JS库地址:https://github.com/inorganik/CountUp.js 使用NPM进行安装: npm install --save countup 根据官方回答,CountU ...

随机推荐

  1. 了解 DML、DDL、DCL

    一.DML DML(Data Manipulation Language)数据操纵语言: 最经常用到的 SELECT.UPDATE.INSERT.DELETE. 主要用来对数据库的数据进行一些操作 S ...

  2. python并发编程之IO模型（实践篇）

    一.阻塞IO 介绍略(请看概念篇) 二.非阻塞IO 在非阻塞式IO中,用户进程需要不断的主动询问kernel数据准备好了没有 # 服务端 import socket import time serve ...

  3. python爬虫框架scrapy 豆瓣实战

    Scrapy 官方介绍是 An open source and collaborative framework for extracting the data you need from websit ...

  4. Apache Tomcat 安装与配置教程

    JDK的安装与配置 1. 从官网下载JDK https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-213315 ...

  5. nginx 设置开机启动

    设置nginx开机启动chkconfig --add /etc/init.d/nginx chkconfig nginx on

  6. ASP.NET Core启动流程

    1. 引言 对于ASP.NET Core应用程序来说,我们要记住非常重要的一点是:其本质上是一个独立的控制台应用,它并不是必需在IIS内部托管且并不需要IIS来启动运行(而这正是ASP.NET Cor ...

  7. 经典SQL数据库面试题以及答案—Oracle版本-SQL全部在plsql开发编写-欢迎提问

    Student(Sno,Sname,Sage,Ssex) 学生表 S1:学号:Sname:学生姓名:Sage:学生年龄:Ssex:学生性别 Course(Cno,Cname,T1) 课程表 C1,课程 ...

  8. maven项目打包和编译跳过单元测试和javadoc

    代码中可能由于单元测试.注释(方法中的参数)或者maven javadoc插件的问题导致无法打包,影响工作,为避免这两种情况可以在打包时输入命令: mvn clean install -Dmaven. ...

  9. Android中ListView的使用

    1.主要概念 ListView用于将大数据集以列表的形式展示. ListView可以看成一个容器,它有如下继承链: View <- ViewGroup <- AdapterView < ...

  10. Django对postgresql数据库进行分组聚合查询

    action(methods=['GET'], detail=False, url_path='count') def count(self, request): """ ...