export & import

chameleon框架的编译时加载方案是在ES6的module能力基础上扩展的，主要由两个命令构成：export和import。

export 命令

export命令用于规定模块的对外接口。

一个模块就是一个独立的文件。该文件内部的所有变量，外部无法获取。如果你希望外部能够读取模块内部的某个变量，就必须使用export关键字输出该变量。下面是一个 JS 文件，里面使用export命令输出变量。

  1. // profile.js
  2. const name = 'Mike';
  3. const gender = 'male';
  4. const age = 24;
  6. export {name, gender, age};

import 命令

import命令用于输入其他模块提供的功能。

使用export命令定义了模块的对外接口以后，通过import命令加载这些模块。导入规范如下表所示：

当前文件后缀仅限导入的类型示例
.cml.js、.json import a from 'a.js'; import b from 'b.json';
*.[web|weex|wx|alipay|baidu].cml.interface、.js、.json import a from 'a.js'; import b from 'b.json'; import c from 'c.interface';
.js.interface、.js、.json import a from 'a.js'; import b from 'b.json'; import c from 'c.interface';
.interface.js、.json import a from 'a.js'; import b from 'b.json';

如果没有加后缀名，会依次查找后缀为.interface, .js的文件

  1. // 会依次查找 profile.interface profile.js
  2. import {name, gender, age} from './profile';
  4. // 最后找到 profile.js
  5. function setName(human) {
  6.   human.textContent = name + ' ' + gender + ' ' + age;
  7. }