参考:https://blog.csdn.net/xyphf/article/details/83411552 (下面的代码亲测有效)

注:导入的模块的方法,只有两种方法  import 和 require() 。可以使用 import 导入的基本都可以使用require导入。export default方法导出的,只能使用import导入。webpack2.0以后基本都使用import的写法

  es6 动态登入模块的方法是 import() ,参考 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/import

方案1:  export (这种方案可以把要导出的一起导出,也一个一个导出)

导出模块:

let run = function () {
console.log('run')
}
let say = function(){
console.log('say')
}
export {run, say} // 最后一起导出

或 (除了这种导出方式,其他的导出方式,文件有多个接口要暴露,都是导出一个对象)

export let run = function () {  // 一项一项的导出
console.log('run')
}
export let say = function(){
console.log('say')
}

导入模块:

import { run, say } from '../../api/test.js'

方案2:  export default (这种导出方案,导入时,只能使用一个变量去接收)

导出模块:

let run = function () {
console.log('run')
}
let say = function(){
console.log('say')
}
export default {run, say}

导入模块:

import test from '../../api/test.js'  //  导入时,只能使用一个变量去接收,如这里的 test

方案3:  module.exports

导出模块:

let run = function () {
console.log('run')
}
let say = function(){
console.log('say')
}
module.exports = {run, say}

导入模块:

import { run, say } from '../../api/test.js'

导入模块的路径:一般导入js文件的路径只有下面三种路径,基本不会使用   绝对路径  和  根目录路径。

1、相对路径 (这个是可行的)

2、npm 包 路径

3、webpack打包配置的路径别名  http://www.cnblogs.com/ye-hcj/p/7082620.html  或  https://blog.csdn.net/m0_37828249/article/details/80781370(注意,配置文件的修改,程序必须要重启npm run dev 才有效)

   vue-cli中路径别名使用:使用别名的路径,别名必须在前面,不然无效报错;在src目录的别名,内置是用@来表示的。

注意:1、路径在后面的一节不一定是文件名,也可能是文件夹的名称。如:import router from './router',这个路径 指向的是 rooter下面的  index.js文件。

   2、webpack2.0后 import 和 module.exports就不能 搭配使用了,所以最好不要使用 module.exports 导出模块。    https://www.jianshu.com/p/e774aa9fb1a1

    vue 导出对象,统一使用export(包括export default)。

webpack 导出、导入模块(及路径)的更多相关文章

  1. Python 学习 第十五篇:模块搜索路径和包导入

    在导入自定义的模块时,除了指定模块名之外,也需要指定目录,由于Python把目录称作包,因此,这类导入被称为包导入.包导入把计算机上的目录变成Python的命名空间,而目录中所包含的子目录和模块文件则 ...

  2. 第五章 Odoo 12开发之导入、导出以及模块数据

    大多数Odoo 模块的定义,如用户界面和安全规则,实际是存储在对应数据表中的数据记录.模块中的 XML 和 CSV 文件不是 Odoo 应用运行时使用,而是载入数据表的手段.正是因为这个原因,Odoo ...

  3. Day 4-1 模块的导入方法和路径

    什么是模块? 在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护. 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码 ...

  4. python-模块入门二(模块循环导入,区分python文件的两种用途,模块搜索路径,软件开发的目录规范)

    一.模块的循环导入问题 run.py # import m1 # 第一次导入 m1.py # 错误示范 ''' print('正在导入m1') from m2 import y #第一次导入m2 x= ...

  5. nodejs 导入导出模块module.exports向外暴露多个模块 require导入模块

    .moudel.exports 导出模块 导出单个模块 // user.js moudel.exports = 函数名或者变量名: //app.js 导入 require('user.js') 当然. ...

  6. 模块导入及使用,关键字,模块搜索路径,python文件的两种用途

    06.05自我总结 一.模块导入及使用 1.模块导入的两种方式 我们拿time模块并使用其中的time功能进行举例 a)第一种 import time print(time.time) import首 ...

  7. 01-Node.js学习笔记-模块成员的导出导入

    什么是Node.js Node.js是一个让javascript运行在服务端的开发平台: Node.js能做什么? 1.基于社交网络的大规模web应用: 2.命令行工具 3.交互式终端程序 4.带有图 ...

  8. python27期day15:自定义模块、模块导入、模块的路径、模块的查找顺序、time、datetime、random、os、sys、作业题

    1.模块的介绍: py文件就是一个模块 2.模块的分类:内置模块:python标准库 200 第三方模块 自定义模块 3.为什么学习模块? 开发效率高,内置函数和模块 减少重复代码,分文件管理,有助于 ...

  9. python 获取导入模块的文件路径

    接触到项目上有人写好的模块进行了导入,想查看模块的具体内容是如何实现的,需要找到模块的源文件. 本博文介绍两种查找模块文件路径方法: 方法一: #!/usr/bin/python # -*- codi ...

随机推荐

  1. 【CF1210D】Konrad and Company Evaluation(vector,图论)

    题意:有i个人,m对两两之间的关系,第i个人初始的薪水为i,有q次操作,第i次操作会把v[i]号的薪水提升成n+i 如果两个人之间存在关系,薪水高的会向薪水低的炫耀 定义u,v,w为一个三元组,当u向 ...

  2. Java反射之方法反射demo

    package reflect; import java.lang.reflect.Method; public class ClassDemo3 { public static void main( ...

  3. MongoDB(7):集群部署实践,包含复制集,分片

    注: 刚开始学习MongoDB,写的有点麻烦了,网上教程都是很少的代码就完成了集群的部署, 纯属个人实践,错误之处望指正!有好的建议和资料请联系我QQ:1176479642 集群架构: 2mongos ...

  4. 如何利用nginx实现负载均衡(总结)

    如何利用nginx实现负载均衡(总结) 一.总结 一句话总结: 推荐使用nginx七层(应用层)负载均衡的实现:配置那是相当的简单 1.nginx配置实例? |||-begin #这里的域名要和下面p ...

  5. C++ 指针基址1

    char *p=(char *)&n;中括号中为什幺要加个*号 答: &n是一个整型数值,代表变量n的地址,不包含其所保存的数据的类型信息(也就是说只凭借一个地址是不能推测出,该地址所 ...

  6. UE编辑器

    引用ue的js 下载地址http://pan.baidu.com/s/1gdrQ35L <script type="text/javascript" src="__ ...

  7. h5调用微信支付功能

    支付按钮的点击事件 $(´.Save_Patient_Msg´).click(function(){ $(´.Save_Patient_Msg´).off(´click´); var hrdfId = ...

  8. mybatis 插入

    实体类 Mapper接口 void addUser(User user); Mapper.xml <insert id="addUser" useGeneratedKeys= ...

  9. Java程序员必精通之—synchronized

    更多Java并发文章:https://www.cnblogs.com/hello-shf/category/1619780.html 一.简介 相信每一个java程序员对synchronized都不会 ...

  10. AOM

    AOM ----  Automation Object Model (自动化对象模型) AOM就是一个可以自动化QTP的自动化对象模型,它可以对QTP的进行自动化配置操作以及QTP的运行回放进行自动化 ...