前段时间碰到一个问题,vue js中要使用import来加载第三方的js,但是后面使用exports.XXX的话会报exports is not defined。那要怎么解决呢? 
首先,我们要了解ES6中是import和exports之间有什么区别? 
import: 是引用第三方文件。import+(常量 | 函数 | 文件 | 模块)名 
exports: 暴露某个常量、函数、文件、模块函数。

那这个问题我们就可以很容易解决了: 
1. 用import来引入所需要的第三方的js。 
2. 函数用function XXX() 来实现。 
3. 用export来暴露function 方法,例如export {XXX}。 
4. 那我们有多个function 方法要进行暴露怎么办?我们可以使用指定一个export default {XXX}来进行默认,其他的均使用export {XXX} 。 
5. 在其他文件中我们怎么使用这些方法?export default {XXX} 我们可以直接 import XXX from ‘XXX’ 
其他使用 import {XXX} from ‘XXX’。

vue 中import和export如何一起使用(一)的更多相关文章

  1. 关于VUE中 import 、 export 和 export default 的注意问题

    1.import引入一个依赖包,不需要相对路径.import 引入一个自己写的js文件,是需要相对路径的. 示例:import axios from ‘axios’; import AppServic ...

  2. Vue中import和require的对比

    Vue中import和require的对比 一.前言 ​ vue框架想必是我们前端朋友们必学的知识点,说它难也没有那么难,说简单也没有那么简单,主要技术就是那么几个,可是里面的细节很多,有些时候我们会 ...

  3. Vue中import from的来源--省略后缀与加载文件夹

    Vue使用import ... from ...来导入组件,库,变量等.而from后的来源可以是js,vue,json.这个是在webpack.base.conf.js中设置的: module.exp ...

  4. Vue中import引入模块路径时的@符号

    1.ES6 模块主要有两个功能:export 和 import export:用户对外输出本模块(一个文件可以理解为一个模块,比如 aaa.js bbb.js)变量的接口 . import:用于在一个 ...

  5. Vue中import用法

    1. 引入第三方插件 第三方常用插件参考https://blog.csdn.net/vbirdbest/article/details/86527886 2. 导入 css 文件 import 'iv ...

  6. vue中import引入模块路径中@符号是什么意思

    在编写vue文件中引入模块 import model from "@/common/model"; 这里路径前面的“@”符号表示什么意思? resolve: { // 自动补全的扩 ...

  7. vue中import xxx from 和 import {xxx} from的区别

    1.import xxx from import FunName from ‘../xxx’ 对应js中的引用: export defualt function FunName() { return ...

  8. Vue中import '@...'是什么

    今天看新项目代码,有import '@/assets/css/theme/index.css'一类的代码,里面的@是做什么的呢.   找到这篇文章https://www.cnblogs.com/bos ...

  9. Vue中import '@...'的意思

    转载: https://blog.csdn.net/xiazeqiang2018/article/details/81325996 写项目的时候看到很多导入都是@开头,这是webpack的路径别名,相 ...

随机推荐

  1. ADC和RTC的寄存器的读取

    ADC的寄存器读取,int adc_read(void){ int result; #if ADSTART==0 result = ADC.ADCDAT0&0x3ff; while(!(ADC ...

  2. Docker的大坑小洼(二)

    再谈<Docker的大坑小洼> 今天闲暇看了一下宏亮同学写的一篇<Docker的大坑小洼>,非常受启发.因为Docker的文章真的很多了,但大家如果只是玩一玩,有很多坑是不会碰 ...

  3. matlab cvx工具包安装

    cvx是凸函数优化的工具包 官网下载地址,http://cvxr.com/cvx/download/ 1 解压到任意文件,最好不要是matlab中的toolbox, 2 假如你解压倒了c盘sample ...

  4. web服务器无法显示font-awesome字体图标

    今天遇到了在本地运行网页 一切调用的额font的小图标都OK的,但是把网页发布到tomcat服务器上面就不行了 之后百度了下,找到了解决方法,遂记录下,方法如下: 在web.xml 文件中加上: &l ...

  5. Django中通过定时任务触发页面静态化的方式

    安装 pip install django-crontab 添加应用 INSTALLED_APPS = [ ... 'django_crontab', # 定时任务 ... ] 设置任务的定时时间 在 ...

  6. cookie和session的区别与联系

    http://www.cnblogs.com/s1nker/p/4876284.html 基本概念 对于许多人来说,都知道的是,cookie是存储在客户端的,可以用来放需要长期使用的内容,例如用户密码 ...

  7. Slice header 中的frame_num的含义?

    Frame_num表示解码的顺序.该图像是参考帧的时候,Frame_num才有意义.非参考帧的frame_num在poc type为2或3时,用于poc值的计算. H264中frame_num定义如下 ...

  8. Android程序员学WEB前端(7)-CSS(2)-伪类字体文本背景边框-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76618373 觉得博文有用,请点赞,请评论,请关注,谢谢!~ 伪类: <!DOC ...

  9. tensorflow windows

    conda create -n py35 python=3.5 activate py35 pip install --ignore-installed --upgrade https://stora ...

  10. SAP NetWeaver Business Client (NWBC) 简介

    1.NWBC 简介 SAP NetWeaver Business Client (NWBC) 是新一代SAP用户界面,集成了SAPGUI事务和新的web dynpro应用,类似于桌面应用程序. SAP ...