【js】三种导出模块的方式：分别暴露、统一暴露和默认暴露

1、分别暴露

使用 export 关键字导出多个函数或变量，每个导出的函数或变量都需要使用 {} 语法进行引入

1、定义js文件，如auth.js

import Cookies from 'js-cookie'

const TokenKey = 'Admin-Token';

export function getToken() {
  return sessionStorage.getItem(TokenKey)
}

export function setToken(token) {

  return sessionStorage.setItem(TokenKey, token)
}

export function removeToken() {
  return sessionStorage.removeItem(TokenKey)
}

2、在需要使用的地方引入

//引入
import { getToken, setToken, removeToken } from '@/utils/auth'
//使用
const uesr = {
state:{
token:getToken()
}
}
setToken(res.token)
removeToken()

2、统一暴露

在一个模块中定义多个函数或变量，并使用 export 关键字导出，最后在另一个模块中使用 import * as 语法进行引入或直接导入
1、直接导入

// math.js
const add = (x, y) => x + y;
const subtract = (x, y) => x - y;

export { add, subtract };

// app.js
import { add, subtract } from './math.js';

console.log(add(5, 6)); // 输出 11
console.log(subtract(6, 2)); // 输出 4

2、import * as 语法进行引入

// math.js
const add = (x, y) => x + y;

const subtract = (x, y) => x - y;

export { add, subtract };

// app.js
import * as math from './math.js';

console.log(math.add(3, 2)); // 输出 5
console.log(math.subtract(3, 2)); // 输出 1

3、默认暴露

使用 export default 关键字导出一个函数或变量，只能在导入时使用任意名称进行引用。
1、定义index.js

import translations from './translations';
export default function customTranslate(template, replacements) {
  replacements = replacements || {};

  // Translate
  template = translations[template] || template;

  // Replace
  return template.replace(/{([^}]+)}/g, function(_, key) {
    return replacements[key] || '{' + key + '}';
  });
}

2、在需要使用的地方引入，defineBpmn 就是自己定义的任意导出名，可以是customTranslate也可以是任意名

 //引入
 import defineBpmn from "./bpmn/CustomTranslate";
 //使用
  additionalModules: [{
  translate: ["value", defineBpmn ]
 },