webpack 模块导入导出方法总结

1、导入的模块的方法,只有两种方法  import 和 require() 。可以使用 import 导入的基本都可以使用require导入。

2、export default方法导出的,只能使用import导入。(ES6方法)webpack2.0以后基本都使用import的写法

详细介绍如下

第一种

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

let run = function () {
  console.log('run')
}
let say = function(){
  console.log('say')
}
export {run, say} 
// 最后一起导出
//注意这种导出变量名的方式  要放在最下面   ES6不会有变量提升

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

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

export let say = function(){
  console.log('say')
}
//逐个导出

导入方式

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

第二种

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

let run = function () {
  console.log('run')
}
let say = function(){
  console.log('say')
}
export default {run, say}
//针对该种方式导出  只可以用 import  ES6方式导入 不可以用require

导入方式

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

第三种

commons.js规则

module.exports  导出

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

导出方式

import Vue from 'vue'

//或者
var Vue = require('vue')
发布了56 篇原创文章 · 获赞 1 · 访问量 1241

猜你喜欢

转载自blog.csdn.net/qq_40819861/article/details/101168801
今日推荐