pages

pages导入各个子域的组件(cpts)来组成页面，应该把组件也作为域的组成部分。严格模式下子域所有依赖需以依赖注入的方式传入，这样保证了每个子域都是独立子应用，方便转成微前端。

import login from 'auth/cpts/login'
export default login

import newTodo from 'todo/cpts/new-todo'
import todoItem from 'todo/cpts/todo-item'
import todoStore from 'todo/adts/store'
export default () => {
  const { todos } = todoStore
  return `
    ${newTodo()}
    <ul>${[...todos.values()].map(todoItem).join('')}</ul>
  `
}

main

main负责全局的注册，项目的启动，路由等

import { dispatch } from 'lib/utils'
import 'auth/adts/hanlders'
import 'todo/adts/handlers'
import router from './router's
window.dispatch = dispatch
function render() {
  document.getElementById('app').innerHTML = router[location.hash]()
}
render()
window.addEventListener('re-render', render)

import login from 'pages/login'
import todoApp from 'pages/index'
import { reRender } from 'lib/utils'
window.addEventListener('hashchange', reRender)
export default {
  '#/login': login,
  '#/': todoApp,
}

这一层都是常规代码没什么好说的。