create-loader
is the underlying whiteboard content rendering module that serves create and can be used for third-party
👌
Use npm
npm install @uiuing/creat-loader
link
cd creat-loader && npm link
cd your-project && npm link creat-loader
Use this way
import createLoader from 'creat-loader';
const state = {
// Content configuration, please see `type` for details.
}
// Same parameters as document.querySelector, and you can also put in HTMLElement objects directly.
const el = '#app'
const app = createLoader(state).mount(el)
☁️
Design and implementation creat-loader
Module catalogue structure design 🤔
-
support
provides rendering etc. basic rendering/ functions requiring high reuse, similar to generic templates. -
components
are responsible for providing the required graphic components and for graphics, e.g. text, rectangles. -
classFile
Its core requirement is to be responsible for events and operations, such as mouse event listening, history operations, and rendering operations. -
common
is responsible forcommon calculations and basic data
, such as coordinate calculations, key storage, and data diff calculations. -
The
API
encapsulates everything into aclass
that requires a lot of code, equivalent to a collection of all code that provides an operation/mount/message publish and subscribe interface to the outside world -
index
cooperates withtype
for type specification of all interfaces, similar to Vue'screateApp(app).mount('#app')
and React'sReactDOM.createPortal(child, container)
.
creat-loader
Module internal implementation design ✨
creat-loader
Data synchronisation design with modular collaboration ✏️
📚
Use of technology -
Code Specification: ESLint + Prettier
-
Code Standards: Airbnb
-
Programming Languages: TypeScript
-
Rendering method: Canvas
-
Subscribe to publish: eventemitter3
-
Module Packaging: Rollup