前端小功能：import和export用法

前端小功能：import和export用法

基本导出导入

export const Object = '导出'
export default Object； // 默认导出

import obj from 'test.js';
import { Object } from 'test.js';
import obj，{ Object } from 'test.js';

导入更改名称冲突

import { default as myObj } from 'text.js';
import { Object as newObj } from 'text.js';

 中间件转发，转默认导出

export { default } from '../components/ListView/style';
export { test as default } from '../components/ListView/style';

 整合所有导出属性

export const test = 'test'
export const fn = () => { console.log('fn') }
export const obj = {
    index: 1,
    title: 'obj',
}

import * as all from "./text.js"
console.log(all) // {test, fn, obj}

 有default的话，default作为all一个属性：{test, fn, obj, default}

import动态导入

import("./test.js").then(all =>{
  console.log('then:', all)
})

函数返回一个promise对象。all 包括default和所有导出的对象。

import导入文件对象

import './test.js';

使用import直接引用一个文件时，会执行一遍这个文件，而不获取任何文件对象。