博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue项目中获取外部js,并使用其中方法
阅读量:6831 次
发布时间:2019-06-26

本文共 756 字,大约阅读时间需要 2 分钟。

因为项目需要,需要从外部获取js,然后在vus项目中使用其中的方法。

如果我们想引用一个库,但是又不想让webpack打包,并且又不影响我们在程序中以CMD、AMD或者window/global全局等方式进行使用,那就可以通过配置externals。这个功能主要是用在创建一个库的时候用的,但是也可以在我们项目开发中充分使用。

在webpack中配置externals

我自己使用的代码如下:


  • 第一步:在最外部的index.html文件中,在<script>标签中引入外部js链接
    

</head>


  • 第二步:利用了webpack中的externals特性,可以加载非打包文件的代码,具体使用方法是,在build文件夹中的webpack.base.conf.js文件中,添加externals,其中的第一个WA是定义的名称,方便之后在其他的vue组件中引用,第二个WA是指引入js文件的输出名称。

    module.exports = {

    context: path.resolve(__dirname, '../'),
    entry: {

    app: './src/main.js'

    },

    // 核心是下面的代码:即通过externals引入非打包js文件
    externals: {

    'WA':'WA',

    },

    ....// 下面省略


  • 第三步:在具体页面中引用WA。比如我在我的mission.vue中,可以这样写:

    import WA from 'WA'

这样就可以在文件中引用相关方法了。比如这里就直接使用了刚刚引入的外部js中的init()方法:

created() {      // 初始化引入的js      WA.init({ ui: false })  },

转载地址:http://kvnkl.baihongyu.com/

你可能感兴趣的文章
android 返回键完全退出程序
查看>>
spring管理serlvet
查看>>
CentOS开机启动RabbitMQ
查看>>
SDL_AudioSpec结构体分析
查看>>
Maven工程发布tomcat无lib包问题
查看>>
使用Scrapy来爬取自己的CSDN文章 (2)
查看>>
MySQL 不用外键的话,如何让表起来关联呢?
查看>>
同时查看集群中多台机器日志的简单的shell脚本
查看>>
GemFire核心功能介绍
查看>>
ZUUL源码分析 <一
查看>>
Spring 启动记录(11)
查看>>
SphereView for tag cloud
查看>>
Autoconf和Automake,自动生成Makefile
查看>>
开源 免费 java CMS - FreeCMS1.2-功能说明-系统配置
查看>>
利用Javascript通过WMI取得Windows系统信息
查看>>
使用WakeLock使Android应用程序保持后台唤醒
查看>>
yum安装出错(Error: Cannot find a valid baseurl for ...
查看>>
上传OpenCart代码到服务器的FTP工具FileZilla使用教程
查看>>
观影《寒战》
查看>>
应用与数据库的 timezone
查看>>