tjcchen / simple-module-bundler

A simple module bundler implemented with javascript and babel

Simple Module Bundler

A simple module bundler implemented with javascript and babel.

Mechanism Explained

In this repo, we implement a very simple module bundler, whose functionality is similar to webpack. Several NPM modules are very important in the whole building process.

1. babylon module, currently known as @babel/parser, is used to convert es6 new syntax to AST(Abstract Syntax Tree) tree structure.[ acornjs - https://github.com/acornjs/acorn ]
2. babel-traverse module, currently known as @babel/traverse, is used to analyze the module dependencies( namely imported modules ) in es6 code.
3. transformFromAst method coming from babel-core, currently known as @babel/core, is used to transforms AST tree structure to es5 code.

Finally, we need to put the generated code into a module wrapper. A simple wrapper looks like the code here.

License

MIT