模块导出导入

// profile.js
export var firstName = 'Michael';
export var lastName = 'Jackson';
export var year = 1958;

// 下面也可以 更优雅
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year };

//导出函数
function v1() { ... }
function v2() { ... }

export {
  v1 , 
  v2 as streamV2, //起别名
  v2 as streamLatestVersion
};

// 错误写法
var m = 1;
export m;

 

import命令具有提升效果,会提升到整个模块的头部,首先执行。
如果多次重复执行同一句import语句,那么只会执行一次,而不会执行多次。
.js后缀可以省略。如果只是模块名,不带有路径,那么必须有配置文件,告诉 JavaScript 引擎该模块的位置。
import { firstName, lastName, year } from './profile.js';

export default

正是因为export default命令其实只是输出一个叫做default的变量,所以它后面不能跟变量声明语句。
var a = 1;
export default a;

function foo() {
  console.log('foo');
}
export default foo;

const router = new VueRouter({
  ...
});
export default router;


export default {
  name:'',
  data() {
    return {
      
    }
  },
  ...
}

//错误写法
export default var a = 1;


 

 

// MyClass.js
export default class { ... }

// main.js
import MyClass from 'MyClass';
let o = new MyClass();

 

使用export default时,对应的import语句不需要使用大括号。

混合导入

//utils.js
export default class { ... }

export function fn(obj, iterator, context) {
   ···
}
let a=10
export {a}

//混合导入
import MyClass ,{fn,a} from ./utils.js

 

你可能感兴趣的:(模块导出导入)